jquery中给动态生成的标签添加点击事件(div绑定点击事件的额多种用法)

时间:2025-03-18 22:15:32

jq的点击事件可以使用以下几种方法

tip:我个人比较喜欢用on来绑定事件来给动态生成的标签添加点击事件

1.直接使用click

$('.label_mask').click(function () {
    ('直接使用click事件')
});

2.使用on绑定事件

//1.普通绑定
$(' .input').on('click', function (event) {
    ('用on绑定事件')
 });


//2.绑定动态生成元素的事件

//.input是已经存在的标签 .select是动态添加元素的标签类名
$(' .input').on('click', '.select', function (event) {
    ('用on绑定动态生成的元素')
});

绑定

$("button").bind("click",function(){
 ('bind绑定点击事件')
});

()方法  ------live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素

$("button").live("click",function(){
 ('live方法点击')
});

()方法-----delegate() 方法的事件处理程序适用于当前或未来的元素

$("div").delegate("button","click",function(){
  ('delegate点击事件')
});

关于版本的使用:

bind()支持Jquery所有版本;live()支持jquery1.9-;delegate()支持jquery1.4.2+;on()支持jquery1.7+;

多个标签绑定同一个事件

$("#div1,.div2,.div3").click(function(){ 
// code... 
});

$(document).on('click', "#div1,.div2,.div3", function () { 
     // code... 
 });