jquery更改功能在下拉列表中不起作用

Question

下拉菜单上的 jquery 更改功能在我的应用程序中不起作用，并且在 jfFiddle 中起作用
应用程序代码

<select id="title" name="title"><option value="">-select-</option>
  <option value="Mr">Mr.</option>
  <option value="Mrs">Mrs.</option>
  <option value="Miss">Miss.</option>
  <option value="Other">Other</option>
  </select>

脚本

<script type="text/javascript">

$(document).ready(function () {

    $("#title").change(function () {
        var value = $("#title").val();
        alert(value);
    });
});

为什么？
是不是我做错了什么？？？

Answer 1

尝试为您的下拉菜单指定一个类：

@Html.DropDownListFor(
    model => model.title, 
    new[] { 
        new SelectListItem { Text = "Mr", Value = "Mr" }, 
        new SelectListItem { Text = "Mrs", Value = "Mrs" }, 
        new SelectListItem { Text = "Miss", Value = "Miss" }, 
        new SelectListItem { Text = "Other", Value = "Other" } 
    }, 
    "-select-",
    new { @class = "myddl" }
)

然后执行一个类选择器而不是一个id选择器：

$(document).ready(function () {
    $('.myddl').change(function () {
        // use $(this) to get the currently changed dropdown list here
        // instead of performing yet another selector
        var value = $(this).val();
        alert(value);
    });
});

我怀疑您有多个下拉列表具有相同的 id（在 <table> 或其他内容中），这是无效的 HTML。