Question

我正在使用此语法来确保事件绑定动态添加的li元素

$('ul.list').on('click', 'li', function() {

   //do something

});

我试图用这样的事件图来存档它：

$('ul.list').hammer({
    css_hacks : false
}).on({
     swipe : function(event){
        //do something
     },
     doubletap : function(event){
        //some more code
     }
}, 'li');

但它根本不起作用。如果我将事件直接绑定到li元素，它适用于现有元素，但不适用于动态添加的元素。

$('ul.list').find('li').hammer({
    css_hacks : false
}).on({
     swipe : function(event){
        //do something
     },
     doubletap : function(event){
        //some more code
     }
});

如何将事件映射绑定到未来的元素？

Answer 1

带有2个参数的

on()与旧的bind()功能相同。

如果你想让它像live()一样工作，请传递第三个参数，如第一个例子。

此外，如果您在hammer()方法上链接函数时遇到问题，请检查它并确保它返回“this”。

$('ul.list').on({
    swipe : function() { ... },
    doubletap : function() { ... }
},'li');

Answer 2

如果你查看jquery文档，jquery live

它说，不支持链接方法。例如，$（“a”）。find（“。offsite，.external”）。live（...）;无效且无法按预期工作。

所以你可以这样做：

$('ul.list > li').hammer({
    css_hacks : false
}).live({
     swipe : function(event){
        //do something
     },
     doubletap : function(event){
        //some more code
     }
});

但它已被弃用，我认为你的第一个例子应该可行。

我试过了：

<ul>
<li>aaa</li>
<li>bbb</li>
</ul>

和

$("ul").on({
    click:function(){
        $(this).html('clicked');
        },
    dblclick:function(){
        $(this).html('double clicked');
        }
    },'li');

它有效，所以我想你的问题可能是事件的名称。

使用event-map动态绑定.on（）方法

2 个答案: