给按钮添加事件的方法

本文详细介绍了五种在按钮上绑定点击事件的方法,包括使用jQuery和原生JavaScript的不同方式,对比了各自的优缺点,建议在统一使用jQuery的项目中采用$(#btn).click()方法,以解决IE兼容性问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

给按钮添加事件的方法

例子:给按钮添加绑定事件:


<button type="submit" id="btn">btn</button>

第一种:
$("#btn").click(function(event){

第二种:
document.getElementById('#foo').addEventListener('click', function() {
});

第三种:
html代码:
<button type="submit" id="btn" οnclick="btn()">btn</button>
js代码:
function btn(){

}

第四种:
$('#btn').bind('click', function();

第五种:
$("btn").on("click",function(){});
结论:
第一种和第二种的效果是一样,可以附加多个事件处理函数,并不是只有使用jquery才能做到。 第三种方法不推荐使用,原则上HTML代码只能体现网页的结构,具体的行为应该使用javascript代码进行绑定。

除非页面上绑定事件的元素超过上万个,否则响应速度的时候就不必纠结了,只做个事件绑定还是很快的。我测试了一下,使用addEventListener绑定3000次,耗时3-4毫秒。

如果项目中统一使用jQuery的话,建议使用第一种做法,顺便还解决了IE的不兼容问题。
---------------------
作者:StromRui
来源:优快云
原文:https://blog.youkuaiyun.com/kye055947/article/details/79619538
版权声明:本文为博主原创文章,转载请附上博文链接!

posted @ 2019-02-13 15:18 动手的程序员 阅读( ...) 评论( ...) 编辑 收藏
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值