如何在需要時將javascript加載到一個頁面ASP.NET MVC4網站中？

Question

我有以下代碼，當用戶單擊“登錄”按鈕時，它將登錄頁面加載到我的單頁網站中。 在這種情況下，href調用MVC4控制器，這將返回帶有HTML的部分視圖。

$('#loginLink')
   .click(function () {
      var $link = $(this);
      var href = $link.attr('data-href');
      $('#article').load(href);
   }
   return false;
});

但我還需要從服務器加載一些其他Javascript。 有人可以告訴我頁面加載后如何執行此操作。 而不是一開始，當我所有的JavaScript都加載到瀏覽器中時。

這是我的登錄頁面的MVC4代碼：

@model WebUx.Models.LoginModel

<section id="content" class="grid_9">
    ........
</section>

@Scripts.Render("~/bundles/jqueryval")

這是javascript捆綁包的C＃代碼：

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
            "~/Scripts/jquery.unobtrusive*",
            "~/Scripts/jquery.validate*"));

即使腳本呈現，但當我使用chrome開發人員工具進行檢查時，似乎它們仍未添加到網頁中。 理想情況下，我不希望它們內聯。 我希望將它們加載為普通js，瀏覽器可以根據其js緩存進行檢查。

Answer 1

腳本實際上已添加。 在您的特定情況下，您正在添加jQuery非侵入式驗證腳本，我想它們對您不起作用，因為一旦將新內容注入到DOM中，您就沒有調用$.validator.unobtrusive.parse方法：

因此，請確保已使用非干擾性驗證框架將所有新添加的元素注冊到DOM中：

$('#loginLink').click(function () {
    var $link = $(this);
    var href = $link.attr('data-href');
    $('#article').load(href, function() {
        $('form').removeData('validator');
        $('form').removeData('unobtrusiveValidation');
        $.validator.unobtrusive.parse('form');
    });
    return false;
});

Answer 2

要執行使用ajax加載的代碼，可以使用該代碼創建一個新標簽，並將其添加到頁面中。 例如 ：

    $("#article").append("<script type='text/javascript' src='script.js'></script>");

應該執行“ script.js”的內容（如果頁面中有一個ID為“ #article”的元素）。 在IE中，必須在要運行腳本的時刻將標記添加到頁面上（不能只在腳本標記上使用.load）。