如果现在让你做一个滑动的效果 然后在右侧显示滑动停止以后的数值 那么很多人会选择input 和output 来使用

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>output</title>
</head>
<body>
<form id="testform">
请选择一个数值<input type="range" min=0 max=100 step=2 value=10 id="input1"></input>
<output id="output1">10</output>
</form>
<script type="text/javascript">
window.onload=function () {
var Input=document.getElementById("input1");
var Output=document.getElementById("output1");
Input.onchange=function () {
Output.value=Input.value;
}
}
</script>
</body>
</html>

为什么不用span之类的行内元素呢? 因为output他的语义救赎输出 还有比他更合适的语义化标签嘛 。。。。

简单的demo 可以去把代码拿过去看一下结果。。。。。。

output的使用的更多相关文章

  1. SubSonic3.0使用存储过程查询时,不能使用output参数返回值的问题修改

    有个群友问SubSonic3.0执行存储过程时能不能使用output参数返回值,说测试过后获取不到返回值,早上有些时间所以就尝试修改了一下 首先在数据库中创建一个存储过程 CREATE PROCEDU ...

  2. OutPut子句的使用限制

    Output子句很方便,多数情况下可以省略了更新后插入或者删除后插入操作表,将2个语句变成1个语句操作.不管从语句美观还是效率上都是有不错的提升, 但是对于Output自身,也是有一些限制的. 从文档 ...

  3. 在output 子句和 scope_identity() 混合使用的时候的注意事项

    无意睹到一篇旧文档 SR0008:考虑使用 SCOPE_IDENTITY 代替 @@IDENTITY :https://msdn.microsoft.com/zh-cn/library/dd17212 ...

  4. Compiler Error Message: CS0016: Could not write to output file 回绝访问

    Compiler Error Message: CS0016: Could not write to output file 'c:\Windows...dll' 拒绝访问 C:\Windows\Te ...

  5. Visual Studio将std::cout输出到Output窗口

    在debug的时候,输出到Output需要使用OutputDebugString函数,但部分库的log是采用std::cout输出的,需要用控制台(黑窗)程序来查看输出.有没有一种使用GUI和Outp ...

  6. sql 存储过程 output参数的使用

    /*嵌套存储过程中需要输出来的参数*/output 就是这个存储过程返回的值 也可以说输出的值--创建存储过程 求最大值CREATE PROCEDURE [dbo].[P_Max]@a int, -- ...

  7. Qt Disable QDebug And Warning Output

    如何禁止qDebug的输出 在项目开发的过程中,为了开发方便,我们常常在Qt的Application Output中输出一些内容,慢慢的. 有些qDebug就会被我们遗忘再角落里. 虽然对整个程序影响 ...

  8. Data Flow的Error Output

    一,在Data Flow Task中,对于Error Row的处理通过Error Output Tab配置的. 1,操作失败的类型:Error(Conversion) 和 Truncation. 2, ...

  9. C#调用SQL中的存储过程中有output参数,存储过程执行过程中返回信息

      C#调用SQL中的存储过程中有output参数,类型是字符型的时候一定要指定参数的长度.不然获取到的结果总是只有第一字符.本人就是由于这个原因,折腾了很久.在此记录一下,供大家以后参考! 例如: ...

  10. insert into output使用

    declare @t table (logId int,customerId int,amount int) insert into log( customerId,amount) output in ...

随机推荐

  1. poj 2324 Anniversary party(树形DP)

    /*poj 2324 Anniversary party(树形DP) ---用dp[i][1]表示以i为根的子树节点i要去的最大欢乐值,用dp[i][0]表示以i为根节点的子树i不去时的最大欢乐值, ...

  2. MBT简述:基于模型的测试

    参考: 1.http://blog.csdn.net/TMQ1225/article/details/53940828 2.http://tmq.qq.com/2016/12/graphwalker/ ...

  3. Lock flag DX

    https://msdn.microsoft.com/en-us/library/windows/desktop/bb322846(v=vs.85).aspx discard nooverwrite ...

  4. python 常用系统参数

    获取当前路径: os.path.abspath('.') 或os.getcwd() 获取上一级路径: print os.path.abspath('..') 获取上上一级路径:  os.path.ab ...

  5. 【Consul】 分布式环境中的服务注册和发现利器

    参考资料: http://www.cnblogs.com/shanyou/p/4695131.html http://blog.csdn.net/viewcode/article/details/45 ...

  6. zabbix通过snmp监控linux主机

    1.安装net-snmp [root@db01 ~]# yum install -y net-snmp 2.修改配置文件 [root@db01 ~]# vim /etc/snmp/snmpd.conf ...

  7. 【转】javascript 的类,原型,继承的理解

    原文: https://www.cnblogs.com/codernie/p/9098184.html ------------------------------------------------ ...

  8. react-native 项目实战 -- 新闻客户端(1) -- 初始化项目结构

    1.在项目根目录新建Componet文件夹(专门用来放我们的自定义组件),里面新建Main.js.Home.js.Message.js.Mine.js.Find.js 2.修改 index.andro ...

  9. Odoo 后端数据库postgreSQL事务级别

    Table of Contents 事务的特性 并行事务的问题 事务隔离级别 Odoo事务隔离级别 odoo事务控制         事务的特性 事务4个特性,简写未ACID 原子性(Atomicit ...

  10. TCP/IP详解 卷一(第十二章 广播和多播)

    广播和多播仅应用于UDP. 广播指的是一个主机向网上的所有其他主机发送帧,而 多播仅发送给属于多播组的多个主机. 为了弄清广播和多播,需要了解主机对由信道传送过来帧的过滤过程 1.首先,网卡查看由信道 ...