Question

我正在进行AJAX调用并返回partialView。在这个partialView中我有我想要执行的脚本。在互联网上搜索后，我发现我需要使用“eval”来完成这项工作。在此之后我发现$ .load（）方法为我做了这个。

然而它对我不起作用。

我的代码：

查看：

<div class="col-md-12" id="headerContainer">
    <div class="col-md-4 col-xs-12 itemContainerHeader">
        <h4> Namn</h4>

    </div>
    <div class="col-md-4 col-xs-12 itemContainerHeader">
        <h4> Epost</h4>
    </div>
    <div class="col-md-4 col-xs-12 itemContainerHeader">
        <h4> Nummer</h4>
    </div>
</div>

@foreach (var c in Model.Customers)
{
    <div class="col-md-12 col-xs-12 containerListItem">

        <div class="col-md-4 col-xs-12">
            @(c.FirstName + " " + c.LastName)
        </div>
        <div class="col-md-4 col-xs-12">
            @c.Email
        </div>
        <div class="col-md-4 col-xs-12">
            @c.PhoenNumber
        </div> 
    </div> 
}

@section Scripts {
    <script type="text/javascript">
            $.scissors.customers.init();
    </script>
}

使用AJAX加载页面时，不会执行init方法：

  getView: function (url, callback, options) {
    var settings = {
        target: "#contentContainer"
    }

    $.extend(settings, options);

    $.LoadingOverlay("show");

    $(settings.target).empty().load(url, function (data) {

        if (callback)
            callback();
        $.LoadingOverlay("hide");
    });
}

$ .load（）的jQuery文档：

脚本执行

使用不带后缀选择器的URL调用.load（）时   表达式，内容在脚本出现之前传递给.html（）   除去。这将在丢弃之前执行脚本块。如果   使用附加到URL的选择器表达式调用.load（），   但是，在更新DOM之前，脚本会被删除，   因此不会被执行。两种情况的例子如下所示：

这里，作为文档一部分加载到#a的任何JavaScript都将   成功执行。

1 $（“＃a”）。load（“article.html”）;

我错过了什么？

Answer 1

这个脚本：

$.scissors.customers.init();

仅在主视图全局加载库时才会执行。即页面头部的图书馆：

<script src='jquery.js'></script>
<script src='scissors.js'></script>

如果scissors.js在全局范围内可用，那么您的脚本将在.load()时执行。

Answer 2

过了一会儿，我想出来了。

问题在于剃刀语法：

@section Scripts {
    <script type="text/javascript">
            $.scissors.customers.init();
    </script>
}

我做了一个AJAX调用并返回了一个partialView，当新的HTML被附加到DOM时，浏览器不知道如何读取剃刀语法。

我只是删除了这样的剃刀语法，它起作用了：

<script type="text/javascript">
        $.scissors.customers.init();
</script>

但是我想指出这是/不是最佳实践解决方案。我有一个函数getView也接受一个回调参数，最好在回调函数中调用init函数，如下所示：

     $.scissors.worker.getView("/Customer/GetCustomer", function () {
            $.scissors.customers.customerCard.edit.init();
        }, options);

如何使$ .load（）执行通过AJAX以HTML格式返回的脚本？

2 个答案: