javascript - Jquery mobile向页面添加按钮不起作用

Question

我正在开发一个 jquery 移动应用程序。我遇到了一个问题，除非我使用 .trigger('create'); ，否则动态添加的按钮将无法工作，但即使在添加触发器之后，我仍然遇到同样的问题。这个问题在这个网站上被问了很多次，但所有答案都建议将 .trigger('create'); 添加到代码中。我该如何解决这个问题？这是我的代码:

var button = $("<a data-role="button" id="my_button">My Button</a>");
$("#my_div").append(button).trigger('create');

$("#my_button").on("click", function(){
    alert("clicked");
});

当我点击按钮时什么也没有发生。

Answer 1

动态添加 anchor 时，请使用.buttonMarkup()来创建它。使用上述增强方法创建时可以不添加data-role="button"。

$("#my_div").append($("<a/>", {
    id: "my_button",
        "data-role": "button"
}).text("Button").buttonMarkup({
    icon: "delete",
    iconpos: "notext"
}));

将事件绑定(bind)到动态创建的元素，应从文档委托(delegate)。

$(document).on("click", ".selector", function () {
  alert("clicked");
});

Demo