[英]Make a select refresh while it's open when changed - chrome
This works as expected on Firefox but not on Chrome. 这在Firefox上可以正常工作,但在Chrome上却没有。
Fiddle example: http://jsfiddle.net/8Ab6c/1/ 小提琴示例: http : //jsfiddle.net/8Ab6c/1/
setTimeout(function(){
$('#s1').append("<option>NEW</option>");
},2000);
If the selectbox is opened when the timeout finishes, the list isn't updated until you close and reopen the selectbox. 如果在超时完成时打开选择框,则在关闭并重新打开选择框之前,列表不会更新。 Is there a way to make it update the select list while it's still open on Chrome? 有没有办法让它在Chrome 上仍然打开时更新选择列表? (I guess on IE too idealy, though that's not required) (我觉得IE太理想了,虽然这不是必需的)
I can use replaceWith
to force it to be deselected but this has an ugly effect and I'd prefer if it just changed the list and kept it open. 我可以使用replaceWith
来强制取消它,但这有一个丑陋的效果,我更喜欢它只是改变了列表并保持打开状态。
The actual situation is that my select box is waiting on an ajax call and it's quite easy for the user to open the select box before the ajax is finished. 实际情况是我的选择框正在等待ajax调用,并且用户很容易在ajax完成之前打开选择框。
There are two pieces to this, you have to blur the drop-down when you update it and then reopen it. 这有两个部分,你必须在更新它时模糊下拉菜单,然后重新打开它。 Taking away focus is easy, reopening the list is not. 拿走焦点很容易,重新打开列表不是。 I used this technique https://stackoverflow.com/a/10136523/436036 to reopen it. 我使用这种技术https://stackoverflow.com/a/10136523/436036重新打开它。
var showDropdown = function (element) {
var event;
event = document.createEvent('MouseEvents');
event.initMouseEvent('mousedown', true, true, window);
element.dispatchEvent(event);
};
setTimeout(function(){
var focused = false;
if($('#s1').is(":focus")) {
$('#s1').blur();
focused = true;
}
$('#s1').append("<option>NEW</option>");
if(focused) {
showDropdown($('#s1')[0]);
}
},4000);
Here is the fiddle: http://jsfiddle.net/8Ab6c/2/ 这是小提琴: http : //jsfiddle.net/8Ab6c/2/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.