Question

我正在尝试将我的JS移动到一个单独的文件中，而不是直接在页面上。但是，出于某种原因，我无法让它发挥作用。

我想根据下拉选项更新网站。我现在这样做的方式是：

查看：

<script type="text/javascript">
$(document).ready(function () {
    $("#EntityType").change(function () {
        /* Get the selected value of dropdownlist */
        var selectedID = $(this).val();

        /* Request the partial view with .get request. */
        $.get('/Entity/Create_DropDownList/' + selectedID, function (data) {

            /* data is the pure html returned from action method, load it to your page */
            $('#entity_form_attributes').html(data);
            /* little fade in effect */
            $('#entity_form_attributes').fadeIn('fast');
        });
    });
});
</script>

    <div class="editor-field">
        @Html.DropDownList("EntityType", (SelectList)ViewData["Types"])
    </div>

    <div id="entity_form_attributes"></div>

这很有效。部分视图按原样加载到div标签中。但是，如果创建一个JavaScript文件，然后将脚本移动到该文件中，则会失败。从共享的起始站点我包含JavaScript文件。

任何人都可以看到我做错了什么。该应用程序是一个MVC3应用程序。是否有设置/属性我必须设置才能使其工作？

Answer 1

任何人都可以看到我做错了什么。

是的，您已在此处对网址进行了硬编码，而不是使用Url帮助程序来生成它。你永远不应该这样做：

$.get('/Entity/Create_DropDownList/'

当您在IIS中部署应用程序时，这会因为您的网址错误而中断。由于此硬编码的URL，您在开头省略了包含虚拟目录名称。

因此在处理ASP.NET MVC应用程序中的URL时总是使用Url帮助程序。因此，在您的情况下，您可以在视图中将此网址生成为HTML5 data-*属性：

@Html.DropDownList(
    "EntityType", 
    (SelectList)ViewData["Types"], 
    new { data_url = Url.Action("Create_DropDownList", "Entity") }
)

然后在您单独的javascript文件中只需检索此网址并使用它：

$("#EntityType").change(function () {
    /* Get the selected value of dropdownlist */
    var selectedID = $(this).val();

    /* Get the url from the data-url HTML attribute */ 
    var url = $(this).data('url');

    /* Request the partial view with .get request. */
    $.get(url, { id: selectedID }, function (data) {
        /* data is the pure html returned from action method, load it to your page */
        $('#entity_form_attributes').html(data);
        /* little fade in effect */
        $('#entity_form_attributes').fadeIn('fast');
    });
});

JavaScript不能从单独的文件中工作

1 个答案: