javascript - jquery 未从更改时的 select 语句获取值

Question

这确实很奇怪，但我可能错过了一些简单的东西。我有一个简单的选择语句，用户可以在其中选择一个值。

onChange 调用函数 getDrop2()，目前我正在尝试让它提醒我选择了哪个选项。

我的html是:

<select  onChange= "getDrop2()" id = "drop1" >
     <option value="0">All</option>
     <option value="1">Alphabetical</option>
     <option value="2">Brewery</option>
     <option value="3">Style</option>
</select>

我的 JavaScript 是:

function getDrop2(){
    var choice = $("#drop1").val()
    alert(choice);

}

警报语句的输出只是空白。

Answer 1

在 jQuery 中，你最好这样做:

<select id = "drop1" >
     <option value="0">All</option>
     <option value="1">Alphabetical</option>
     <option value="2">Brewery</option>
     <option value="3">Style</option>
</select>

使用以下 JavaScript:

 $(function(){
    $('#drop1').change(function() {
        var choice = $(this).val();
        alert(choice);
    }
  });

这个想法是，jQuery 现在自动将更改函数附加到 id 为“drop1”的选择。通过使用此模式，您已将 HTML 与执行业务逻辑的 JavaScript 解耦。