Question

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

使用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/

如果已选择该选项，如何获取HTML Select元素的通知

1 个答案: