jquery - 外部 javascript 不起作用，而内部 javascript 起作用

Question

我有 mvc4 网页，其中有 @Html.TextBox()

@Html.TextBox("searchString", null, new { id = "searchingForProject" })     

此文本框有 keyup监听器，它将启动 ajax 搜索项目，如果结果成功则更新 View

var timeoutReference;
var timeoutforloading;
$(function () {

   $("#searchingForProject").keyup(function () {
        timeoutReference = setTimeout(function () {
            timeoutforloading = setTimeout(function () {
                $("#imageWebGridLoad").show();
                $("#gridcontent").hide();
            }, 250);

            var value = $("#searchingForProject").val();
            $.ajax({
                url: '@Url.Action("Index", "Project")',
                contentType: 'application/html; charset=utf-8',
                type: "GET",
                dataType: 'html',
                data: { searchString: value },
            }).success(function (result) {

                $('projects').html(result);
                clearTimeout(timeoutforloading);
            });
        }, 750);
    });
});

问题是，如果这个函数放在内部 <script> 中，它就可以正常工作。 ，但如果将它放在外部 javascript 文件中，它不会给我任何结果。

我知道它调用该函数，如 $("#imageWebGridLoad").show(); 0.25 秒后开始旋转。

我的 Ajax 调用中是否存在错误，或者是否无法在像这样的外部 js 文件中执行此操作？

Answer 1

我不使用 MVC4，但我的猜测是现在 JS 是外部的，ASP 不会将 @Url.Action("Index", "Project") 转换为实际的用于 AJAX 的 URL。我相信，如果您将此信息作为隐藏的 div 放在 HTML 中，然后使用 jQuery 选择器调用它，您将能够按照您想要的方式使用它:

// HTML
<div id="ajaxurl" class="hidden">@Url.Action("Index", "Project")</div>

// JS
$.ajax({
  url: $('#ajaxurl').text(),
  // ...
})

或(感谢 Satpal)

// HTML
<div id="ajaxurl" class="hidden" data-url='@Url.Action("Index", "Project")'></div>

// JS
$.ajax({
  url: $('#ajaxurl').data('url'),
  // ...
})