利用mousover触发函数对range的操作练习

  1. <!DOCTYPE html>
  3. <html>
  5.     <head>
  7.         <meta charset="utf-8" />
  9.         <title>range测试</title>
  11.         <script type="text/javascript">
  13.             function myfunction(){
  15.                 var x=document.getElementById("rang").value;
  17.                 document.getElementById("text").value=x;
  19.             }
  21.             function myfunction2(){
  23.                 var x=document.getElementById("text2").value;
  25.                 document.getElementById("rang2").value=x;
  27.             }
  29.         </script>
  31.     </head>
  33.     <body> 
  35.               <!--滑动range获得值-->
  37.               <p>滑动range获得标值</p>
  39.         <input type="text" id="text"/><br/>
  41.         <input type="range" id="rang" onmousemove="myfunction()"/><br/><br/><br/><br/><br/>
  43.                 <!--用值控制range-->
  45.                 <p>输入数字控制range值</p>
  47.         <input type="text" id="text2" onmousemove="myfunction2()" placeholder="请输入0-100之间的数"/><br/>
  49.         <input type="range" id="rang2" />
  51.     </body>
  53. </html>

input中range相关操作的更多相关文章

  1. 理解CSV文件以及ABAP中的相关操作

    在很多ABAP开发中,我们使用CSV文件,有时候,关于CSV文件本身的一些问题使人迷惑.它仅仅是一种被逗号分割的文本文档吗? 让我们先来看看接下来可能要处理的几个相关组件的词汇的语义. Separat ...

  2. 记录工作中linux相关操作

    在项目部署之后,查看日志能查看部署结果是否正确部署. 最开始查看日志我会使用cat service.log tail -f service.log vim service.log 打开日志之后 /+查 ...

  3. c语言中文件相关操作

    一 .首先介绍一下数据文件的类型: 1.二进制文件(映像文件):在内存中以二进制形式存取. 2.文本文件(ascii文件):以ascii码形式存取的文件. 通俗的讲,在Mac下,你把一个文件丢进记事本 ...

  4. ueditor 插件集成到 xadmin 中的相关操作

    安装 点击这里下载源码包 在相关的虚拟环境下安装源码方式安装 切入解压后路径进行 python setup.py install 注册 安装成功按照普通app一般注册在 django 程序的app 中 ...

  5. Java中JSONObject相关操作

    maven项目pom配置: <dependency> <groupId>net.sf.json-lib</groupId> <artifactId>js ...

  6. sqoop导入数据到hive表中的相关操作

    1.使用sqoop创建表并且指定对应的hive表中的字段的数据类型,同时指定该表的分区字段名称 sqoop create-hive-table --connect "jdbc:oracle: ...

  7. Django中查询相关操作

    查询集特性 1)惰性查询:只有在实际使用查询集中的数据的时候才会发生对数据库的真正查询. 2)缓存:当使用的是同一个查询集时,第一次使用的时候会发生实际数据库的查询,然后把结果缓存起来,之后再使用这个 ...

  8. Java中字符串相关操作（判断，增删，转换）

    1:判断字符串中是否包含某个字符(字符串): startsWith(): 这个方法有两个变体并测试如果一个字符串开头的指定索引指定的前缀或在默认情况下从字符串开始位置 此方法定义的语法如下: publ ...

  9. element-ui 中 el-table 相关操作

    1.带checkbox  获取所有选择的行. this.$refs.multipleTable.selection 获取选中的单行 this.$refs.roleTable.store.states. ...

随机推荐

  1. html+css手记

    ----------------------html定义和基本结构---------------------- HTML是 HyperText Mark-up Language 的首字母简写,意思是超 ...

  2. jq获取图片的原始尺寸，自适应布局

    原理: each()遍历,width().height()获取宽高, load() 注意: 由于页面加载完了,但图片不一定加载完了,所以直接通过 $("img").width(), ...

  3. ThreadLoacl的反思

    在我的随笔 spring mvc:注解@ModelAttribue妙用  中使用ThreadLocal来简化spring mvc控制层controller中的ModelMap,Response.Jso ...

  4. vue 父子组件传参

    父向子组件传参 例子:App.vue为父,引入componetA组件之后,则可以在template中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,component ...

  5. Project 9:两种简单数列排序

    1.冒泡法排序 /* 冒泡排序法的核心思想就是依次把最大的数换到最后面. 若有n个数 就需要通过n-1次循环来排序. 具体做法就是从第一个数开始 两个数比较大小大的换到后面,这样最大的就在最后了. 然 ...

  6. 如何在centos7上安装源码包

    在我们使用linux的过程中,有很多程序是通过红帽官网给的系统中安装的,但是一般来说,系统更新的速度比较慢,如果这个时候我们又想用最新版的该怎么办呢?总不能一直等系统升级吧╮(╯﹏╰)╭所以,我们可以 ...

  7. 团队作业4——第一次项目冲刺（Alpha版本） 日志集合处

    第一天(2017.4.23) http://www.cnblogs.com/1413none/p/6752325.html 第二天(2017.4.24) http://www.cnblogs.com/ ...

  8. 201521123103 《Java学习笔记》 第八周学习总结

    一.本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 集合部分:TreeMap实现类:对键值进行排序. Map的entrySet Set<Map.Entry&l ...

  9. 201521123105 第8周Java学习总结

    1.本周学习总结 1.1思维导图 2. 书面作业 本次作业题集集合 1.List中指定元素的删除(题目4-1) 1.1 实验总结 1.删除元素的时候从最后一个元素开始,避免删除元素后位置发生变化而导致 ...

  10. 201521123089 《Java程序设计》第4周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 总结: (1)类名的首字母一定要大写. (2)制类型转换:类强制转换为子类时只有当引用类型真 ...