动态添加新对象时Javascript停止

Question

我试图动态添加后面带有一些JS的新“ li”对象，但是当我添加它们时，添加的“ li”中的JS不起作用。

这是JS： JavaScript文件

这就是我添加新的“ li”的方式：

$(document).ready(function () {
    $('#search-bar').keyup(function (event) {
        if (event.keyCode == 13) {

            addNew();

        }
    });

    function addNew() {
        var city = $('#search-bar').val();
        $.ajax({
            url: '@Url.Action("getWeatherSearch", "Index")',
            data: { city: city },
            async: false,
            complete: function (resp) {
                $("#rb-grid").prepend(resp.responseText);
            }
        });
    } });

我在控制器中调用的C＃中的函数返回带有“ li”的字符串。

仅调用Boxgrid.init（）并没有帮助。

Answer 1

采用

$('#parentofli').on('click', 'li', function(e) {
   $(this). whatever you want to do on the li
});

每当您希望JS在动态插入的对象上运行时

当您在选择器上使用常规JavaScript时，文档准备就绪后，所有内容都将被绑定。 如果之后插入元素，JS函数将不知道该元素存在，因此不会绑定。

当您将父级用作选择器时，javascript会绑定到PARENT本身，每当您单击父级时，它将通过每个父级绑定函数并查看其是否匹配