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;
});

イベントはイベント ハンドラーにバブル アップし、イベントを発生させます。これには、1 つのイベント ハンドラーで数百のオブジェクトからのイベントを処理できる可能性があるという別の利点があります。ガイドラインとして、変更されない最も近い親オブジェクトにリスナーをバインドしてみてください。この例の場合、これは Container div です。これにより、泡立ちが最小限に抑えられます。

于 2013-01-30T17:41:43.967 に答える