如何使用 jQuery 在 <select > 上捕获第二个选择？答案

【问题标题】：How to catch the second select on <select > with jQuery?如何使用 jQuery 在 <select > 上捕获第二个选择？
【发布时间】：2010-11-30 02:48:15
【问题描述】：

第一次点击展开<option>，

第二次点击选择其中一个。

如何捕捉第二次点击？

【问题讨论】：

复制：stackoverflow.com/questions/898463

标签： jquery select click

【解决方案1】：

您可以像这样使用jQuery's one function 链接一些事件：

$('select').one('click', firstClick);

function firstClick(evt) {
    //do anything you might want to do
    $(evt.target).parent().one('click', secondClick);
}

function secondClick(evt) {
    //again, do you thing
    $(evt.target).parent().one('click', firstClick);
}

one 函数将执行您提供的事件处理程序一次，然后将其删除。此解决方案允许您在每次单击时切换处理程序。如果你使用这个，请小心。您还需要处理blur 事件来重置第一个处理程序。

您还可以使用jQuery's live function 来最小化您正在创建的事件处理程序的数量，从而节省内存。这也将避免我在第一个解决方案中可以预见的一些问题。

$('select option').live('click', selectHandler);

function selectHandler(evt) {
    //insert magic here
}

【讨论】：

【解决方案2】：

皮特答案的 jQuery 版本，我认为可以满足所提出的问题

$("option").click(function(){
   alert($(this).text());
});

编辑

由于上述内容不是跨浏览器，我进行了一些搜索，并在此处发现了一篇关于堆栈溢出的帖子，这可能会有所帮助。

Fire event each time a DropDownList item is selected with jQuery

【讨论】：

这似乎不兼容跨浏览器。在 Chrome 3.0、IE6 和 Firefox 3.5 中测试。它只适用于我的 Firefox。
可能是.text()，你可能要试试.html()
在 IE6 或 Chrome 3.0 中根本不会调用 alert 函数，因此将其更改为 .html() 没有任何区别。
尝试附加其他文本的警报--alert("text: " + $(this).text())--查看事件处理程序是否正在执行。

【解决方案3】：

您始终可以在组合框中的每个选项上使用 onclick。它不漂亮，但它应该可以工作：

<select>
    <option onclick="alert('May');">May</option>
    <option onclick="alert('June');">June</option>
    <option onclick="alert('July');">July</option>
</select>

【讨论】：

【解决方案4】：

如果选择发生变化，则调用onchange 方法。

【讨论】：

如果用户点击一个相同的选项进行第二次点击怎么办？我不想错过这个案例。
我也在为此苦苦挣扎，Shore，根据我的发现，我不知道你是否能做点什么:(不过我会关注这个问题。
似乎无能为力
@Shore：我认为这也不可能。也许你应该自己实现这样一个选择元素。
我更新了我的答案以包含一个帖子的链接，该帖子解决了选择相同答案的问题。