js和jquery批量绑定事件传参数一(新猪猪原创)


Posted in Javascript onJune 23, 2010
<input type="button" value="btn1" id="btn1"/> 
<input type="button" value="btn2" id="btn2"/> 
<input type="button" value="btn3" id="btn3"/> 
<script type="text/javascript"> 
for(var i=1;i<=3;i++){ 
document.getElementById('btn' + i).onclick = (function(j){ 
return function(){ 
alert(j); 
} 
})(i); 
} 
</script>

下面是结合了jquery的代码,原理都是一样的
在使用javascript批量绑定页面上的元素并传递递增编号时,需要如下编写:
<html>部分的代码:
<input type="button" id="btn1" value="按钮1" /> 
<input type="button" id="btn2" value="按钮2" /> 
<input type="button" id="btn3" value="按钮3" /> 
<input type="button" id="btn4" value="按钮4" /> 
<input type="button" id="btn5" value="按钮5" /> 
<input type="button" id="btn6" value="按钮6" /> 
<input type="button" id="btn7" value="按钮7" />

<js>部分的代码:
$(function () { 
var i; 
for (i = 1; i <= 7; i++) { 
$("#btn" + i).bind("click", { id: i }, dis); 
} 
}); function dis(evt) { 
alert(evt.data.id); 
}
Javascript 相关文章推荐
利用JQuery为搜索栏增加tag提示
Jun 22 Javascript
jQuery中的常用事件总结
Dec 27 Javascript
JavaScript高级程序设计(第3版)学习笔记 概述
Oct 11 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
Oct 11 Javascript
小白谈谈对JS原型链的理解
May 03 Javascript
详解微信小程序开发之城市选择器 城市切换
Jan 17 Javascript
jQuery实现一个简单的验证码功能
Jun 26 jQuery
AngularJS 控制器 controller的详解
Oct 17 Javascript
react-native-video实现视频全屏播放的方法
Mar 19 Javascript
Javascript获取某个月的天数
May 30 Javascript
electron实现qq快捷登录的方法示例
Oct 22 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
Aug 08 Javascript
获取dom元素那些讨厌的位置封装代码
Jun 23 #Javascript
jquery ajax 同步异步的执行示例代码
Jun 23 #Javascript
jquery tab插件制作实现代码
Jun 22 #Javascript
jquery多浏览器捕捉回车事件代码
Jun 22 #Javascript
浏览器脚本兼容 文本框中,回车键触发事件的兼容
Jun 21 #Javascript
在IE6下发生Internet Explorer cannot open the Internet site错误
Jun 21 #Javascript
复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
Jun 21 #Javascript
You might like
深入解析PHP中的(伪)多线程与多进程
2013/07/01 PHP
php邮箱地址正则表达式验证
2015/11/13 PHP
IIS 7.5 asp Session超时时间设置方法
2017/04/17 PHP
jquery控制listbox中项的移动并排序
2009/11/12 Javascript
javascript showModalDialog模态对话框使用说明
2009/12/31 Javascript
基于jquery的一个简单的脚本验证插件
2010/04/05 Javascript
根据选择不同的下拉值出现相对应的文本输入框
2013/08/01 Javascript
jquery防止重复执行动画避免页面混乱
2014/04/22 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
2015/01/19 Javascript
JavaScript蒙板(model)功能的简单实现代码
2016/08/04 Javascript
微信小程序 地图map实例详解
2017/06/07 Javascript
Vue中父组件向子组件通信的方法
2017/07/11 Javascript
JS 正则表达式验证密码、邮箱格式的实例代码
2018/10/28 Javascript
实例讲解JS中pop使用方法
2019/01/27 Javascript
实例分析编写vue组件方法
2019/02/12 Javascript
JS实现倒序输出的几种常用方法示例
2019/04/13 Javascript
基于JS实现父组件的请求服务过程解析
2019/10/14 Javascript
Vant picker 多级联动操作
2020/11/02 Javascript
python实现ipsec开权限实例
2014/11/11 Python
在Python中操作列表之list.extend()方法的使用
2015/05/20 Python
简单谈谈python中的语句和语法
2017/08/10 Python
Python实现桶排序与快速排序算法结合应用示例
2017/11/22 Python
Python打印“菱形”星号代码方法
2018/02/05 Python
linux安装Python3.4.2的操作方法
2018/09/28 Python
使用Python实现跳帧截取视频帧
2019/05/31 Python
详解Python 4.0 预计推出的新功能
2019/07/26 Python
Python Django 页面上展示固定的页码数实现代码
2019/08/21 Python
Python安装whl文件过程图解
2020/02/18 Python
python使用正则表达式匹配txt特定字符串(有换行)
2020/12/09 Python
python 基于pygame实现俄罗斯方块
2021/03/02 Python
美国一家著名的儿童鞋制造商:Stride Rite
2017/01/02 全球购物
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
《灰椋鸟》教学反思
2014/04/27 职场文书
教师党的群众路线对照检查材料
2014/09/24 职场文书
巾帼标兵事迹材料
2014/12/26 职场文书
mysql部分操作
2021/04/05 MySQL