Question

以下是我的视图，其中包含一个div，根据视图中执行的操作呈现部分视图。

//Boiler Plate HTML
<div id="PartialViewHolder">
        @Html.Partial(Model.PartialView, Model)
</div>
//Boiler Plate HTML

部分视图通过ajax调用呈现，如下所示

//The url is supplied based on some actions in the main view
function AjaxCall(url){
    $.ajax({
        url: url,
        cache: false,
        success: function (html) {
            $("#PartialViewHolder").empty();
            $("#PartialViewHolder").html(html);
        },
        error: function (result) {
            alert("Error: " + result.status + ": " + result.statusText);
        }
    });
}

主页面还会加载一些其他脚本，这些脚本对于部分视图是通用的。这些脚本在首次呈现页面时起作用，即在呈现默认局部视图时。但是，这些脚本停止处理由ajax调用加载的部分视图。我相信当DOM元素发生变化时，需要重新加载这些脚本。我正在寻找一种干净的方法来重新加载部分视图div时重新加载这些脚本。

Answer 1

您需要阅读有关事件绑定的一些内容。 http://api.jquery.com/on/

一开始很难理解，但一旦你这样做就值得。

假设你有一些像这样的代码。

<div class="container">
    <div class="partial">
        <a href="#" class="magic-link">Click here to do stuff</a>
    </div>
</div>

JS代码就像下面的例子一样，只适用于你进行绑定时出现的对象（通常是document.ready（））看起来这就是你所描述的情况。

$(".magic-link").click(function(){
    alert("Magic link clicked");
    return false;   
})

如果您希望事件触发尚未加载到页面上的对象，则需要将事件处理程序绑定到容器div，即不更改的位。喜欢这个

$(".container").on("click", ".magic-link", function(){
    alert("Magic link clicked");
    return false;
});

事件冒泡到事件处理程序并触发事件。这具有另一个优点，即一个事件处理程序并可能处理来自数百个对象的事件。作为指导尝试将侦听器绑定到不会更改的最近的父对象。在示例的情况下，这是Container div。这可以使冒泡降到最低。

将JQuery脚本加载到由ajax调用呈现的局部视图中

1 个答案: