Question

我已经在更改下拉列表选项中的javascript中定义了名为Bind_ChainHotel的函数，我通过ajax将数据填充到另一个下拉列表中。我在MVC5中使用HtmlHelper.DropDownList。每当我选择任何选项时，我都会在控制台中收到此错误。

 @Html.DropDownList("ddlShellLevel", new List<SelectListItem>
                                                    {
                                                        new SelectListItem{Text="Chain",Value= "1"},
                                                        new SelectListItem{Text="Hotel",Value= "2"}
                                                    }, "Select Level", new { onchange = "Bind_ChainHotel(this.value);", @class = "form-control" })

的Javascript

(function Bind_ChainHotel(id) {
    $.ajax({
        url: '@Url.Action("Bind_ChainHotel", "Shell")',
        type: "POST",
        data: { "id": id },
        success: function (data) {
            $("#ddlChain_Hotel").empty();
            $.each(data, function (i, chain_hotel) {
                $("#ddlChain_Hotel").append('<option value="' + chain_hotel.Value + '">' +
                     chain_hotel.Text + '</option>');
            });
            if (id == 1) {
                $('#lblChainHotel').text('Select Chain');
                $("#ddlChain_Hotel").prepend('<option value="0">Select Chain</option>');
            }
            else {
                $("#lblChainHotel").text("Select Hotel");
                $("#ddlChain_Hotel").prepend('<option value="0">Select Hotel</option>');
            }
        }
    });
})();

Answer 1

删除前括号和后括号

function Bind_ChainHotel(id) {
  $.ajax({
    .....
  });
};

Answer 2

Stephen Muecke 的答案是对的，但他不能解释，所以我会这样做。

您定义函数如下，注意它已定义并存储，未执行。

function Bind_ChainHotel(id) { /* do something with id */ }

现在，当您在括号中添加括号()时，您可以通过其名称调用该功能。由于存储了该功能，您可以随时随地执行该操作：

Bind_ChainHotel("myId"); // with this invocation function is executed

在您的代码中，您同时执行定义和执行，在括号内定义函数，然后由最后添加的第二个括号立即执行：

(function Bind_ChainHotel(id) { /* do something with id */ }) ();

这称为IIFE（立即调用函数表达式）。该函数未存储，一次执行后它就消失了，你不能再调用它了。

还有另一个不是错误，但值得注意：您多次编写$("#ddlChain_Hotel")，并且每次创建具有相同内容的新jQuery对象。这要写得多，并且需要花费很多时间来执行。创建一个对象并将其存储在变量中，然后通过它的名称引用var。

// wrap the code in a $(document).ready to ensure that all DOM elements are there at runtime
$(document).ready(function() {

    var ddlChain = $("#ddlChain_Hotel"),
        lblChain = $('#lblChainHotel');

    function Bind_ChainHotel(id) {
        $.ajax({
            /* ... */
            success: function(data) {
                ddlChain.empty(); // var ddlChain holds $("#ddlChain_Hotel")
                /* ... */
            }
        });
    }
});

未捕获的ReferenceError：未定义Bind_ChainHotel

2 个答案: