Question

所以我有一个国家/地区列表，显示为带有select元素的下拉列表

这是我的HTML：

<select id="myList">
 <option>United States</option>
 <option>France</option>
 <option>Great Britain</option>
 <option>China</option>
 <option>Russia</option>
</select>

<span id="selectedCountry"> </span>

我希望能够将#selectedCountry的值设置为用户实际选择的选项。

我尝试设置.mouseUp() jquery事件，如下所示：

$("#myList").mouseup(function() {

   var val = $(this).val();
   $("#selectedCountry").text(val);

 });

奇怪的是，此代码会触发.mousedown() / .click()事件，但不会触发我打算执行的操作......

有关如何使用mouseup()获取select元素值的任何想法吗？

ps：我知道focusout()事件会产生类似的结果（as explained here），但我想了解是否有关于select元素和{{1}的特定内容事件。

感谢

Answer 1

我个人会使用.change event

.mouseup()事件在Chrome和Firefox之间的行为略有不同。此外，如果以编程方式更改值，.mouseup()事件将不会捕获对值的更改，但.change()事件将会发生。

$("#myList").change(function() {

   var val = $(this).val();
   $("#selectedCountry").text(val);

});

<强> FIDDLE

Answer 2

MouseUp事件处理Javascript＆＃34; Mouseup＆＃34;事件。您要实现的目标应该由Change事件来完成，因为当您在浏览器中更改下拉列表值时，实际上会触发该事件。

html上的MouseUp（）事件选择不起作用

2 个答案: