在 Mustache JS 中生成按钮时，单击事件/绑定事件在 jQuery 中不起作用

Question

我有一个按钮，它是通过 mustache JS 模板在函数中生成的。

{{#attributes}}
    <a class="button--small btn" data-selector="{{selector}}">{{title}}</a>
{{/attributes}}

其示例输出是

<a class="button--small btn" data-selector=".news">More News</a>

但是，我试图在单击此按钮时执行另一个 jquery 功能，但无论我使用 .click(function() { }); 还是 .bind 它似乎都不起作用？即使是 console.log 也不会打印，所以我没有进入正确的条件。

这是脚本：

function lazyload(selector) {
    $("a[data-selector^='"+selector+"']").bind("click", function(e) {
            e.preventDefault();
            loadNews(selector);
    });
}

$(document).ready(function(){
   lazyload(".news"); // CALL FUNCTION READY FOR USAGE
});

Answer 1

对于新创建的元素，您需要委托 event：请参阅 "Direct and delegated events" 部分。

function lazyload(selector) {
   $(document).on("click", "a[data-selector^='"+selector+"']", function(e) {
        e.preventDefault();
        loadNews(selector);
   });
 }

在 Mustache JS 中生成按钮时，单击事件/绑定事件在 jQuery 中不起作用

Click event / bind event not working in jQuery when generating buttons in Mustache JS

javascript

jquery

mustache