JQuery assign events to buttons(JQuery 将事件分配给按钮)
问题描述
我有 50 个动态生成的 HTML 按钮如下:
I have 50 dynamically generated HTML buttons as follows:
<input type="button" id="btn1" name="myButton" value="Click Me" />
<input type="button" id="btn2" name="myButton" value="Click Me" />
:
:
:
<input type="button" id="btn50" name="myButton" value="Click Me" />
使用 jQuery 将点击事件分配给所有按钮的最佳方法是什么?
Which is the best way to assign click event to all buttons using jQuery?
使用 id 还是使用 name 属性?
By using id or by using name attribute ?
推荐答案
事件监听器消耗内存.您必须仔细考虑应该如何实现侦听器.
Event listeners cost memory. You have to think carefully about how you should implement the listeners.
1.直截了当的方法:
不要使用这个
如果每个按钮的行为相同,请使用类:
If the behaviour for each button is the same, use a class:
$(".btn").click(function() {
// Do something
});
如果每个按钮的行为不同,则将事件分配给不同的#ID
If behaviour for each button is different, assign events to different #IDs
$("#btn1").click(function {
// Do something
});
<强>2.使用 .on():
jQuery 1.7 引入了 .on() 方法,它将所有侦听器包装到 1 个方法中.
jQuery 1.7 introduced .on() method that wraps all listeners to 1 method.
$("button").on("click", function() {
// Do something
});
但是,我们仍然在页面上绑定了很多监听器.
However, we are still binding many listeners on the page.
3.使用包装器(使用这个!):
用一个 div 包裹你的按钮并为它创建一个监听器.
Wrap your buttons with a div and create one listener for it.
$("#wrapper").on("click", "button", function() {
// Do something
});
有用的资源:
- 性能对比
- .on()
这篇关于JQuery 将事件分配给按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:JQuery 将事件分配给按钮
基础教程推荐
- Node.js 有没有好的索引/搜索引擎? 2022-01-01
- 如何在特定日期之前获取消息? 2022-01-01
- 每次设置弹出窗口的焦点 2022-01-01
- jQuery File Upload - 如何识别所有文件何时上传 2022-01-01
- WatchKit 支持 html 吗?有没有像 UIWebview 这样的控制器? 2022-01-01
- Javascript 在多个元素上单击事件侦听器并获取目标 2022-01-01
- 什么是不使用 jQuery 的经验技术原因? 2022-01-01
- 为什么我在 Vue.js 中得到 ERR_CONNECTION_TIMED_OUT? 2022-01-01
- 如何使用sencha Touch2在单页中显示列表和其他标签 2022-01-01
- 如何使用 CSS 显示和隐藏 div? 2022-01-01
