JQuery将事件分配给按钮

Question

我有50个动态生成的HTML按钮,如下所示:

<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将click事件分配给所有按钮的最佳方法？

通过使用id或使用name属性？

Answer 1

事件监听器会耗费内存.您必须仔细考虑如何实现侦听器.

1.直截了当的方式:

不要使用它

如果每个按钮的行为相同,请使用以下类:

$(".btn").click(function() {
    // Do something
});

如果每个按钮的行为不同,请将事件分配给不同的#ID

$("#btn1").click(function {
    // Do something
});

2.使用.on():

jQuery 1.7引入了.on()方法,它将所有侦听器包装到1个方法中.

$("button").on("click", function() {
    // Do something
});

但是,我们仍然在页面上绑定许多侦听器.

3.使用包装器(使用它!):

用div包裹你的按钮并为它创建一个监听器.

$("#wrapper").on("click", "button", function() {
    // Do something
});

有用的资源:

• 性能比较
• .上()