javascript - 当已选择选项时如何获取 HTML Select 元素的通知

Question

我有一个包含 3 个选项的 HTML Select 元素。如果用户选择第三个选项，我想将他们重定向到不同的页面。我最初的实现是这样的:

Javascript:

<script type="text/javascript">
function handledropdown(e) {
 var profile = e.options[e.selectedIndex].text;
 //if the option selected is not 'Option3', do nothing
 if (profile == 'Option3') {
     window.location.href="some-page.php";
 }
}    </script>

HTML:

<select  id='test_dd' name='options' onChange='handledropdown(this)' >
  <option title='Option1' value='1' >Option1</option>
  <option title='Option2' value='2' >Option2</option>
  <option title='Option3' value='3' >Option3</option>
</select>

这种方法可行，但如果已经选择了 Option3，触发 onChange 事件的唯一方法是取消选择它并重新选择它 - 在已经选择它时单击它不会触发更改事件。我尝试通过添加 onClick 事件处理来解决这个问题，如下所示:

<select  id='test_dd' name='options' onChange='handledropdown(this)' onClick='handledropdown(this)' >
<option title='Option1' value='1' >Option1</option>
<option title='Option2' value='2' >Option2</option>
<option title='Option3' value='3' >Option3</option>
</select>

这似乎在 Safari 中工作正常，但在 IE 和 Firefox 中，如果已经选择了 Option3，一旦您单击选择元素打开选项，您就会被重定向到重定向页面(在 Chrome 中也是如此)似乎根本不起作用)。

有什么想法可以解决这个问题吗？

Answer 1

只需使用

 $("#test_dd").mouseup(function() {
    var open = $(this).data("isopen");

    if(open) {
        if ($(this).val()=="3")
            alert("hi")
    }

    $(this).data("isopen", !open);
});

http://jsfiddle.net/prollygeek/UK6q8/2/