Chrome无法在Chrome的选择菜单上使用模糊功能
[英]Blur is not working for select menu on chrome
问题描述
I want blur select menu when it is open. 
我想要模糊选择菜单，当它打开时。 I have made a small function when you hover the mouse on a tag then blur function will call. 当您将鼠标悬停在标签上时，我做了一个小功能，然后调用模糊函数。 It is working fine in other browser but not working in chrome. 在其他浏览器中可以正常工作，但在chrome中不能正常工作。 fiddle 小提琴
Reproduce bug : click and open select menu and hover anchor tag, open select menu should be closed 重现错误：单击并打开选择菜单并悬停锚标记，应关闭打开的选择菜单
<head>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
$('a').hover(function(){
$('select').blur();
})
})
</script>
</head>
<body>
<select>
<option>Test</option>
<option>Test</option>
<option>Test</option>
<option>Test</option>
<option>Test</option>
<option>Test</option>
<option>Test</option>
</select>
<a href="#">hover me</a>
</body>
</html>
2 个解决方案
解决方案1
3 已采纳 2013-05-24 14:57:46
I had the same problem, and the idea was clear: you cannot blur an opened select element, because Chrome and Safari waits for the answer. 我遇到了同样的问题，想法很明确：您无法模糊打开的选择元素，因为Chrome和Safari等待答案。 BUT there is a workaround that you may find acceptable. 但是，有一种解决方法可能会被您接受。
First, you cannot set focus to another element while the "select" is still active, so I have removed it by applying a "display:none". 首先，在“选择”仍处于活动状态时，无法将焦点设置到另一个元素，因此我通过应用“ display：none”将其删除。 After that I trigger a click event on another harmless element. 之后，我触发了另一个无害元素的click事件。 And then I re-add the select back, by setting a display:block. 然后我通过设置display：block重新添加选择。 In this case, the code would look like(i will add a span to click on): 在这种情况下，代码看起来像（我将添加一个跨度以单击）：
.......
<select>
<option>Test</option>
......
</select>
<a href="#">hover me</a>
<span class="clickable">element clicked</span>
.......
<script type="text/javascript">
$(document).ready(function (){
jQuery("a").mouseenter(function (){
$("select").css({'display':'none'});
$("span.clickable").focus().click();
$("select").css({'display':'block'});
});
});
</script>
解决方案2
-1 2013-05-22 11:33:41
You need to use .trigger() for that 您需要为此使用.trigger（）
<select id="selectboxId">
.......
</select>
$ ('#selectboxId').trigger('blur');
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.