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 相关文章推荐
for 循环性能比较 提高for循环的效率
Mar 19 Javascript
jquery随意添加移除html的实现代码
Jun 21 Javascript
Js 时间间隔计算的函数(间隔天数)
Nov 15 Javascript
JavaScript 操作table,可以新增行和列并且隔一行换背景色代码分享
Jul 05 Javascript
JQuery下拉框应用示例介绍
Apr 23 Javascript
jQuery中attr()和prop()在修改checked属性时的区别
Jul 18 Javascript
node.js中的favicon.ico请求问题处理
Dec 15 Javascript
微信小程序 image组件binderror使用例子与js中的onerror区别
Feb 15 Javascript
AngularJS实现自定义指令及指令配置项的方法
Nov 20 Javascript
JS控制鼠标拒绝点击某一按钮的实例
Dec 29 Javascript
vue中实现Monaco Editor自定义提示功能
Jul 05 Javascript
vue + el-form 实现的多层循环表单验证
Nov 25 Vue.js
获取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 多维数组排序(usort,uasort)
2010/06/30 PHP
各种页面定时跳转(倒计时跳转)代码总结
2013/10/24 Javascript
javascript模拟枚举的简单实例
2014/03/06 Javascript
javascript圆盘抽奖程序实现原理和完整代码例子
2014/06/03 Javascript
Jquery api 速查表分享
2015/01/12 Javascript
javascript面向对象快速入门实例
2015/01/13 Javascript
javascript获得当前的信息的一些常用命令
2015/02/25 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
2015/03/26 Javascript
多种JQuery循环滚动文字图片效果代码
2020/06/23 Javascript
微信小程序 富文本转文本实例详解
2016/10/24 Javascript
谈谈第三方App接入微信登录 解读
2016/12/27 Javascript
微信小程序  TLS 版本必须大于等于1.2问题解决
2017/02/22 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
2017/12/14 Javascript
Angular项目如何升级至Angular6步骤全纪录
2018/09/03 Javascript
JS获取月的第几周和年的第几周实例代码
2018/12/05 Javascript
js实现图片实时时钟
2020/01/15 Javascript
Python生成验证码实例
2014/08/21 Python
浅析python中SQLAlchemy排序的一个坑
2017/02/24 Python
分享几道你可能遇到的python面试题
2017/07/24 Python
python的socket编程入门
2018/01/29 Python
取numpy数组的某几行某几列方法
2018/04/03 Python
selenium+Chrome滑动验证码破解二(某某网站)
2019/12/17 Python
HTML5在a标签内放置块级元素示例代码
2013/08/23 HTML / CSS
HTML5制作表格样式
2016/11/15 HTML / CSS
全球知名旅游社区巴西站点:TripAdvisor巴西
2016/07/21 全球购物
领导干部考察材料
2014/02/08 职场文书
元旦促销方案
2014/03/15 职场文书
党员实事承诺书
2014/03/26 职场文书
三方协议书范本
2014/04/22 职场文书
教师节宣传方案
2014/05/23 职场文书
新文化运动的基本口号
2014/06/21 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
四风对照检查材料范文
2014/09/27 职场文书
小平小道观后感
2015/06/09 职场文书
如何利用python和DOS获取wifi密码
2021/03/31 Python
详解MySQL多版本并发控制机制(MVCC)源码
2021/06/23 MySQL