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

 更新时间:2010年06月23日 11:20:44   作者:  
js绑定事件传参,javascript绑定事件传参数,jquery绑定事件传参数
复制代码 代码如下:

<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在selenium的使用过程

    Javascript和jquery在selenium的使用过程

    这篇文章主要介绍了Javascript和jquery在selenium的使用过程,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-10-10
  • js实现飞入星星特效代码

    js实现飞入星星特效代码

    这篇文章主要介绍了js实现飞入星星特效代码,主要通过控制背景与飞入点的样式,结合setTimeout函数即可实现星星飞入的效果,对于学习javascript有不错的参考借鉴价值,需要的朋友可以参考下
    2014-10-10
  • JavaScript函数扩展与箭头函数超详细讲解

    JavaScript函数扩展与箭头函数超详细讲解

    这篇文章主要介绍了JavaScript函数扩展与箭头函数的使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习吧
    2022-11-11
  • JS上传前预览图片实例

    JS上传前预览图片实例

    上传图片对图片进行一下预览,可以了解图片上传后大概会是什么样子,此功能用js实现,然后在fileupload控件的change事件中调用,这样当用fileupload选择完图片以后,图片就会自动显示出来了。功能很简单,却很实用。
    2013-03-03
  • Javascript中Math.max和Math.max.apply的区别和用法详解

    Javascript中Math.max和Math.max.apply的区别和用法详解

    这篇文章主要介绍了Javascript中Math.max和Math.max.apply的区别和用法,本文给大家啊介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-08-08
  • element ui分页多选,翻页记忆的实例

    element ui分页多选,翻页记忆的实例

    今天小编就为大家分享一篇element ui分页多选,翻页记忆的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • JS彻底弄懂GMT和UTC时区

    JS彻底弄懂GMT和UTC时区

    这篇文章主要介绍了JS彻底弄懂GMT和UTC时区,对时间感兴趣的同学,可以参考下
    2021-04-04
  • el-form实现表单和图片手动上传和校验功能

    el-form实现表单和图片手动上传和校验功能

    在写项目时,难免遇到需要上传表单,图片等文件,且表单内容需进行验证及必填项提示,图片需要和信息一起传递且图片载入后需可预览,这篇文章给大家介绍el-form实现表单和图片手动上传和校验功能,感兴趣的朋友一起看看吧
    2024-01-01
  • JS数组操作之增删改查的简单实现

    JS数组操作之增删改查的简单实现

    本篇文章主要介绍了JS数组操作之增删改查的简单实现,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • JS实现局部选择打印和局部不选择打印

    JS实现局部选择打印和局部不选择打印

    这篇文章主要介绍了JS选择打印内容,主要是把自己要打印的东西用一个DIV层抱起来,需要的朋友可以参考下
    2014-04-04

最新评论