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 可拖拽的窗体控件实现代码
Mar 21 Javascript
JS分页控件 可用于无刷新分页
Jul 23 Javascript
JavaScript基于ajax编辑信息用法实例
Jul 15 Javascript
jquery+json实现动态商品内容展示的方法
Jan 14 Javascript
jqGrid用法汇总(全经典)
Jun 28 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
Oct 18 Javascript
解析javascript图片懒加载与预加载的分析总结
Oct 27 Javascript
获取当前月(季度/年)的最后一天(set相关操作及应用)
Dec 27 Javascript
VueJs单页应用实现微信网页授权及微信分享功能示例
Jul 26 Javascript
webpack 处理CSS资源的实现
Sep 27 Javascript
微信小程序实现录音功能
Nov 22 Javascript
uni-app微信小程序登录授权的实现
May 22 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
imagettftext() 失效,不起作用
2021/03/09 PHP
JavaScript prototype对象的属性说明
2010/03/13 Javascript
JavaScript作用域链使用介绍
2013/08/29 Javascript
JS自调用匿名函数具体实现
2014/02/11 Javascript
Jquery 点击按钮自动高亮实现原理及代码
2014/04/25 Javascript
jQuery操作cookie方法实例教程
2014/11/25 Javascript
js树插件zTree获取所有选中节点数据的方法
2015/01/28 Javascript
JS实现鼠标滑过折叠与展开菜单效果代码
2015/09/06 Javascript
javascript实现计时器的简单方法
2016/02/21 Javascript
JavaScript_object基础入门(必看篇)
2016/06/13 Javascript
jQuery简单实现中间浮窗效果
2016/09/04 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
JointJS流程图的绘制方法
2018/12/03 Javascript
小程序实现可拖动的悬浮按钮
2020/09/07 Javascript
Python3.x版本中新的字符串格式化方法
2015/04/24 Python
解密Python中的描述符(descriptor)
2015/06/03 Python
python 递归遍历文件夹,并打印满足条件的文件路径实例
2017/08/30 Python
漂亮的Django Markdown富文本app插件的实现
2019/01/02 Python
python交互界面的退出方法
2019/02/16 Python
Python使用修饰器进行异常日志记录操作示例
2019/03/19 Python
OpenCV+face++实现实时人脸识别解锁功能
2019/08/28 Python
python中round函数如何使用
2020/06/19 Python
浅析python字符串前加r、f、u、l 的区别
2021/01/24 Python
Conforama西班牙:您的家具、装饰和电器商店
2020/02/21 全球购物
Big Green Smile法国:领先的英国有机和天然产品在线商店
2021/01/02 全球购物
英语专业毕业个人求职自荐信
2013/09/21 职场文书
生产部统计员岗位职责
2014/01/05 职场文书
物业工作计划书
2014/01/10 职场文书
负责人任命书范本
2014/06/04 职场文书
大学专科自荐信
2014/06/17 职场文书
教师个人年终总结
2015/02/11 职场文书
大学生个人总结范文
2015/02/15 职场文书
房地产销售员岗位职责
2015/04/11 职场文书
假期读书倡议书3篇
2019/08/19 职场文书
win sever 2022如何占用操作主机角色
2022/06/25 Servers