Question

我有一个多选下拉列表，例如：

<select id="myList" multiple="multiple">  
    <option value="1">Opt #1</option>
    <option value="2" selected="selected">Opt #2</option>
    <option value="3" selected="selected">Opt #3</option>
    <option value="4">Opt #4</option>
</select>

如果我然后选择Opt #4，那么我如何才能获得Opt #4而不是Opt #2和Opt #3？我知道我可以通过这个获得所有选择的选项：

var selectedOptions = $("#myList option:selected");

但是我只想要点击的选项 - Opt #4。这可能吗？

编辑：请注意，当我操纵change事件中的列表时，我无法在click事件中执行此操作。还添加了缺失的多个。

Answer 1

您可以在每个选项元素的点击处理程序中获取它：

$("#myList option").click(function() {
    var clickedOption = $(this);
});

<强>更新

编辑：当我在更改事件中操作列表时，我无法在点击事件中执行此操作。

在这种情况下，您需要使用on委派活动。试试这个：

$("#myList").on("click", "option", function() {
    var clickedOption = $(this);
});

但有一点需要注意的是，option元素在IE中根本不会引发click个事件，因此上述任何一个都不会在该浏览器中起作用。

Answer 2

如您所知，如果用户在未按下Cntrl键的情况下点击了选项＃4，那么您将只选择选项＃4作为选定选项。

如果用户在按下Cntrl键的情况下点击了选项＃4，则将选择所有三个选项。因此，将返回所有三个选项。如果您只想要选项＃4，那么您需要添加一个点击事件处理程序。

Answer 3

以下内容会对您有所帮助吗？

$('#myList').delegate('option', 'click', function (opt) {
  alert('Option ' + opt.value + ' was clicked');
});

Answer 4

真正的答案：

select.onclick = function(e) {
  console.log(e.target.value);
};

在多个下拉列表中获取单击选项

4 个答案: