0

以下是我的视图,其中包含一个 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 时重新加载这些脚本的干净方法。

4

1 回答 1

3

您需要阅读一些有关事件绑定的信息。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。这将冒泡保持在最低限度。

于 2013-01-30T17:41:43.967 回答