浅谈<label>与<input>合作的两种方式
来源:互联网 发布:当期应纳增值税的算法 编辑:程序博客网 时间:2024/06/01 12:09
<label>标签来定义表单控制间的关系,当用户选择该标签时,浏览器会自动将焦点转到和标签相关的表单控件上。
1、通过为<input>设置id属性,在<lable>标签中设置for=id来让说明文本和对应的<input>关联起来。
<label for="Name">Number:</label><input type="text" id="Name"/>
2、<label>包裹<input>标签,点击<label>,<label>响应两次,即<label>本身出发和<input>触发后冒泡到<label>。
<body><label for="input"><input id="input" type="text"/>label</label><script>var label = document.getElementsByTagName("label")[0];var input = document.getElementById("input");label.addEventListener("click", function() { alert("label");}, false);input.addEventListener("click", function(e) { alert("input");}, false);</script></body>
输出:"label" "input" "label"。
1 0
- 浅谈<label>与<input>合作的两种方式
- 浅谈<label>与<input>合作的两种方式
- input与label的对齐
- 使用 C# 进行 label 打印 的两种方式
- C# 打印Label的两种方式及实现
- 使用 C# 进行 label 打印 的两种方式 .
- 浅谈创建对象的两种方式
- # 浅谈多线程的两种实现方式
- 表单label与input对齐的方法
- 浅谈onclick与addEventListener两种添加事件方式的区别
- 浅谈c++创建对象的两种方式
- 浅谈FPGA串口通信数据解析的两种方式
- input两种默认显示文字方式
- input两种默认显示文字方式
- input checkbox 与 后面的 label文字对齐
- label自适应的两种方法
- HTML中label的两种使用方法
- HTML中label的两种使用方法
- SQL Server游标的使用
- 由system.currentTimeMillis() 获得当前的时间
- python输出格式化及函数format
- PHP的flock函数 阻塞与非阻塞
- gson circular reference error问题
- 浅谈<label>与<input>合作的两种方式
- iOS 之绘制直线、曲线、矩形等
- 利用开源组件POI3.0.2动态导出EXCEL文档
- java中的枚举类
- Android Support Design 库 之 Snackbar使用及源码分析
- lianliankan
- 前端到node后台的十万个啥东西,综合指南针!
- 第十一讲项目五 坐标转换
- Javascript 函数声明和函数表达式的区别