[英]Choosing same option in select list
我所拥有的是通过jquery填充的html选择列表。 现在,我发生了更改事件,因此当我更改选项时,地图将重新聚焦于POI。 我试图使其工作,以便当我单击相同的选项时,地图将其视为更改事件。 选项不支持点击事件,并且在选择列表中添加点击事件也不起作用,因为将有2个点击事件。
总之,如果您单击相同的选项,.change()不会触发。
有没有办法使这项工作,对选项标签的修改或我可能不知道的其他事件?
谢谢!
尝试做这样的事情:
$('select').on({
change: function(e) {
alert('change')
$(this).data('change', true);
},
click: function() {
if (!$(this).data('change')) {
$(this).trigger('change');
}
$(this).data('change', false);
}
});
因此,其想法是仅在之前没有选项更改时才在点击时触发更改事件。 为此,我们可以像设置data-change
一样设置一些标志。
正确答案:
我只是编辑这个答案,这样我就可以接受这个正确答案,因为这个想法是正确的,但是实现不是。 正确的方法是删除.change事件。 链接到正确的代码: http : //jsfiddle.net/qcJwm/1/ 。
码:
$('select').click(function () {
if ($(this).data('click')) {
doStuff();
$(this).data('click', false);
} else {
$(this).data('click', true);
}
});
var doStuff = function () {
alert('stuff');
}
您可以添加没有价值的第一个选项。 更改时,将第一个选项的值更改为所选选项的值,然后执行“ goto代码”。
因为您希望能够再次更改它,所以必须使用$('item')[0].selectedIndex=0
选择第一个选项。 用户不会注意到这一点,因为它具有相同的值。 因此,您的用户可以再次将其更改为他们刚刚选择的选项,以将其折回
我遇到了同样的问题,但也需要它在移动设备上工作,因此我组合了几种不同的解决方案。 不幸的是,在没有多次触发目标函数的情况下,我没有找到一种方法来完成所有这些工作,因此我最终使用setTimeOut
对其进行了限制。 :(
它远非完美,但在我的情况下有效:
<select id="select">
<option disabled selected>Pick one..</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="4">four</option>
<option class="dummy" style="display:none">Pick one..</option>
</select>
和jQuery:
var canDo = true; //variable for settimeout
$('#select').on('focus',function(){
$(this).find("option.dummy").text($(this).find("option:selected").text());
$(this).find("option.dummy").prop("selected", true);
$(this).data('click', true);
});
$('#select').on('change blur',function(){
//blur is optional and offers solution to the case where user closes options
//in mobile ja taps away (if you then want to trigger the function). BUT, it
//also causes a bug: if user opens options and clicks the topmost option, which
//is the header bar showing currently selected option, options are hidden and
//function triggered - but the focus stays on the element, so when user clicks
//away, function is re-triggered.
var select = $(this);
var text = select.find("option:selected").text();
$('.dummy').attr('value',select.val()).text(text);
doYourThing($(select).val());
});
$('#select option').on('click',function(){ //note that we're checking clicks to option instead of select
if($(this).data('click')){
$(this).data('click', false);
doYourThing($(select).val());
}else{
$(this).data('click', true);
}
$(this).parent().blur();
});
function doYourThing(stuff){
if(canDo){
canDo = false;
alert('Selected '+stuff);
canDoTimeout = setTimeout(function(){
canDo = true;
}, 500);
}
}
jsFiddle: http : //jsfiddle.net/nxabv0wk/3/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.