获取即使它并没有改变所选的选项

当选择一个新的选项jQuery的.change事件可以被用来获取在select所选值：获取即使它并没有改变所选的选项

$('select').change(function() { 
    var selectedValue = $('option:selected').val(); 
    console.log(selectedValue); 
});

我怎样才能获得值，如果选择选项没有改变？

即选择“选项1”。然后用户再次选择'选项1'。我需要以获得此时的价值。

.onchange在这些情况下不起火。

有没有可以使用的另一个事件？

Here's a fiddle

来源

2013-06-24 Turnip

你就不能读根据需要的价值？ - 为什么你需要它绑定到一个事件？ –

这是一款手机导航菜单。我需要用户选择菜单项时的值 – Turnip

使用点击事件代替 – hAlE

试试这个.. 第一警报会给不变值。

var defaultVal = $('select').val(); 
alert(defaultVal); 
$('select').change(function() { 
    var selectedValue = $(this).val(); 
alert(selectedValue); 
});

来源

2013-06-24 13:41:39 Krishna

尝试选择已选择的选项http://jsfiddle.net/cR3MQ/7/不起作用 – Turnip

您可以使用点击甚至选择，我不知道，如果它适用于所有的浏览器签出的文档 here，这样你可以得到的选项

来源

2013-06-24 13:47:56 bitkot

已经尝试过。 '.click'在选项上不起作用。在铬至少。 http://jsfiddle.net/cR3MQ/6/ – Turnip

我也试过了，它在Firefox上工作。 – bitkot

尝试像任何点击事件这样的：

(function($) { 
    $.fn.selected = function(fn) { 
     return this.each(function() { 
      var clicknum = 0; 
      $(this).click(function() { 
       clicknum++; 
       if (clicknum == 2) { 
        clicknum = 0; 
        fn(this); 
       } 
      }); 
     }); 
    } 
})(jQuery); 

$('select').selected(function(val) { 
    alert(val.value) 
});

DEMO-- >http://jsfiddle.net/cR3MQ/5/

来源

2013-06-24 13:50:31

你的演示对我来说不适用于Chrome。无论选择什么，都不会提醒任何人？ – Turnip

@ 3rror404对我来说工作正常.. :) –

试试这个。通过了IE11和FireFox 35.01的测试。这一个避免了这个bug，在Dhaval Marthak的代码示例中，无论您是否点击该选项，它都会在第二次点击时调用该函数。

更多： http://jsfiddle.net/cR3MQ/11/

(function($) { 
    $.fn.selected = function(fn) { 
     return this.each(function() { 
      var $select = $(this); 
      var val = $select.val(); 
      $(this).children('option').on('click',function() { 
       if(val === $(this).val()){ 
        $select.trigger('unchange'); 
       }else{ 
        // $select.trigger('change'); 
       } 
       fn(this); 
       val = $select.val(); 
      }); 
     }); 
    } 
})(jQuery); 

$('select').selected(function(val) { 
    alert(val.value) 
}).on('unchange',function(){ 
    alert('unchange'); 
}).on('change',function(){ 
    alert('change'); 
});

支持铬（版本40.0.2214.115m），Firfox 35.01，IE 11： http://jsfiddle.net/cR3MQ/13/

(function($) { 
    $.fn.selected = function(fn) { 
     return this.each(function() { 
      var $select = $(this); 
      var val = $select.val(); 
      var optionClick = false; 
      $(this).children('option').each(function(i,e){ 
       $(this).get(0).onclick = function() { 
        optionClick=true; 
        if(val === $(this).val()){ 
         $select.trigger('unchange'); 
        }else{ 
         // $select.trigger('change'); 
        } 
        fn(this); 
        val = $select.val(); 
       } 
      }); 

      var clicked = 0, changed = 0; 
      $select.on('change',function(){ 
       changed++; 
      }).on('click',function(ev){ 
       if(true === optionClick){ 
        /*do nothing*/     
       }else{ 
        if(0 === changed && 0 > ev.offsetX && 0 > ev.offsetY){ 
         $select.trigger('unchange'); 
          fn(this); 
        }else{    
         changed = 0; 
        } 
       } 
      }); 
     }); 

    } 
})(jQuery); 

$('select').selected(function(val) { 
    console.log(val.value) 
}).on('click',function(ev){ 
    //console.log(ev); 
}).on('unchange',function(){ 
    console.log('unchange'); 
}).on('change',function(){ 
    console.log('change'); 
});

来源

2015-02-25 08:41:05

无法在Chrome，Firefox或Safari上使用Mac – Turnip

感谢您的提及。我做了一些铬的升级（没有safari currenly），我的firefox是35.01（这对第一/第二解决方案的工作）。现在看到：http：//jsfiddle.net/cR3MQ/13/ –

@uʍopǝpısdn。在尝试尽可能合理地识别它之后，我猜测没有使用浏览器检测插件或自绘UI（例如https://github.com/jquery-collection/jQuery-Skinner）。我们无法为所有浏览器兼容编码。另外，我攻击了Windows7中支持Safari的解决方案，我不建议（http://jsfiddle.net/cR3MQ/14/）。 –

$('.yourSelect option').click(function() { 
    var selectedValue = $('.yourSelect').val(); 
    console.log(selectedValue); 
});

来源

2015-09-20 03:29:19 Osaurus

最好给你的答案增加一些解释，以便海报知道它为什么可以起作用。 –

获取即使它并没有改变所选的选项

回答

相关问题