Question

我仍然在学习JS和JQuery，并且遇到了点击事件未触发的问题。我创建了一个菜单，其标题应该是可点击的。

            var title = document.createElement('h1');
            title.textContent = "HW Tools";
            title.className += "SelectableMenu";
            hwSection.appendChild(title);

在Jquery部分，我有：

    $(document).ready(function () {
        $("#Menu_HW_Main").on('click', '.SelectableMenu', function () {
            alert("Test");
        })

其中#Menu_HW_Main是包含菜单的div的id。但是，当我点击标题时，警报不会显示。

当我在DOM中创建标题/菜单时，事件触发正常。但是当我通过JS创建它时，它不会触发。我错过了什么？

Answer 1

您的代码似乎没问题，但您可以仅使用JS创建jQuery而不是混合香草h1：

var h1 = $('<h1/>', {'text':'HW Tools', 'class':'SelectableMenu'});

$("#Menu_HW_Main").append(h1);

如果"#Menu_HW_Main"也是动态的（由js）元素创建，请尝试以下操作：

$(document).on('click', '.SelectableMenu', function () {
    alert("Test");
});

JQuery On Click事件没有使用JS创建的元素触发

1 个答案: