Question

我有一个这样的下拉列表：

<select name="test" onchange="test();">
    <option value="1" selected="selected">1</option>
    <option value="2">2</option>
</select>

function test()
{
    alert('hi');
}

页面加载值1被选中，如果用户再次选择1，我希望触发onchange事件。我怎样才能实现这个功能？

Answer 1

这不会导致onchange触发，但可以做任何你想做的事情onchange，无论点击哪个<option>。

HTML：

<select name="test">
    <option value="1" selected="selected">1</option>
    <option value="2">2</option>
</select>

JS：

$(function() {
    $("[name='test'] > option").click(function() {
        alert("value clicked");
    });
})

Fiddle

Answer 2

您需要在选项上绑定click事件并在单击

时触发更改事件

<select name="test">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

$(function() {
    BindClickHandlers($('select'));
    $('select').on('change', OnChange);
})
function OnChange (event) {
    setTimeout(function () {
        BindClickHandlers(event.currentTarget);
    }, 0);
}
function BindClickHandlers(selectObject) {
    $(selectObject).find('option').off('click');
    $(selectObject).find(':selected').on('click', function () {
        $(selectObject).trigger('change');
    });
}

检查Fiddle

Answer 3

 <select>
   <option value="apple">apple</option>
   <option value="mango">mango</option>
   <option value="orange">orange</option>
   <option value="banana">banana</option>
 </select>



 $(document).ready(function(){
 var select = $("select");

 var screenDif = 0;
 select.bind("hover", function (e) {
    screenDif = e.screenY - e.clientY;
 });
 select.bind("click", function (e) {
    var element = $(e.target);
    var eventHorizon = screenDif + element.offset().top + element.height() -     $(window).scrollTop();
    if (e.screenY > eventHorizon)
        alert(this.value);
    });
   });

以下是演示http://jsfiddle.net/wFc8X/

我希望你能实现这个目标。

如果未更改值，则触发onchange事件

3 个答案: