下拉列表上的更改事件的值为空

Question

在 DropDownListFor 上有一个 changeEvent，它确实会触发事件的代码，但是所选项目为空，即 $(this).val(); 是 null

查看：

<script>
    $(function () {
        $("#selected_listBulletinBoardsMessages").change(function (e) {
            var val = $(this).val();          
            ..
        });
    });
</script>
<div>

    <div id="selected_listBulletinBoardsMessages">
        @Html.DropDownListFor(model => model.listBulletinBoardsMessages, Model.listBulletinBoardsMessages.Select(b => new SelectListItem() { Value = b.Department, Text = b.Department }), "All Departments", new { @class = "form-control" })
    </div>


</div>

我做错了什么？

Answer 1

因为 div 个元素没有 "values"。您需要 select 元素的值。理想情况下，您应该绑定到 that 元素的 change 事件：

$("#selected_listBulletinBoardsMessages select").change(function (e) {
    var val = $(this).val();          
    ..
});

但是，如果出于此问题上下文之外的原因，您想像当前一样绑定到 div，那么您可以从其中的 select 获取值。您已经拥有的 e 事件变量可以让您到达那里。也许是这样的：

$("#selected_listBulletinBoardsMessages").change(function (e) {
    var val = $(e.target).val();          
    ..
});

当然，如果 div 中有多个 select 元素，这可能需要更改。不过，目前您显示的代码并非如此。

另请注意，这是基于 DropDownListFor() 确实生成了 select 元素的假设。我无法想象为什么它不会，但我想这是可能的。您至少要做的是检查实际的 HTML 并查看那里有什么，以便改进用于访问 HTML.

的任何 JavaScript 代码

Answer 2

应该是这样的

<script>
$(function () {
    $("#selected_listBulletinBoardsMessages select").change(function (e) {
        var val = $(this).val();          
        ..
    });
});
</script>

因为您正在尝试调用 div change event，在这种情况下不应该存在。

Answer 3

div 没有 change 事件。

您应该侦听 select 的 change 事件，从而将 ID 指定给 DropDownListFor 元素。

<div>
    @Html.DropDownListFor(model => model.listBulletinBoardsMessages, 
      Model.listBulletinBoardsMessages.Select(b => new SelectListItem() { Value = b.Department, Text = b.Department }),
     "All Departments", 
     new { @class = "form-control", 
           id="selected_listBulletinBoardsMessages" 
     })
</div>

下拉列表上的更改事件的值为空

Value is null from change event on dropdownlist

asp.net-mvc

jquery

asp.net-mvc-3

asp.net-mvc-5