JavaScript 调用局部视图时不工作

Question

美好的一天，

加载局部视图时，JavaScript 功能对加载的代码无效。当我把它放回索引时，一切都很顺利。我尝试了很多解决方案，但没有一个有效或我不太明白，所以我决定问一下。

我有一个模式（在我的索引中），我在点击按钮时加载局部视图。一切都按预期工作，但部分视图的 JS 不工作。我知道我错过了什么，但我不知道是什么。

关于调用局部视图的函数：

$("#coinflipCreateBtn").click(function () {
$.ajax({
    type: "GET",
    url: "/coinflip/load-inventory",
    success: function (d) {
        debugger;
        $('#coinflip-inventory-userId').html(d);
    },
    error: function (exception) {
        alert("Exception:" + exception);
    }
});
});

以及假设在局部视图上工作的函数：

var x = document.getElementsByClassName('col-item');

$(x).on('click', function () {
    var assetId = $(this).data('assetid');

    $(this).toggleClass('selected');

    checkValueIfExist(assetsArray, assetId);
    buttonVisibility();
});

我应该用不同的方式称呼它吗？以某种方式在部分或？感谢任何帮助...

干杯

Answer 1

将事件绑定到元素的代码在您加载新 HTML 之前执行。您按类名收集所有元素，然后将它们绑定到单击事件。显然，任何尚不存在的 HTML 都不能成为元素集合的一部分，因此没有向它们注册点击事件。

您可以重构将事件绑定到您在 $.html(d) 部分之后调用的函数的代码。在运行再次执行该代码后，一切应该会如您所愿。

JavaScript 调用局部视图时不工作

JavaScript not working when Partial View is called

javascript

partial-views