模糊不適用於Chrome上的選擇菜單

我想在模糊選擇菜單打開時使用。當您將鼠標懸停在標籤上時，我做了一個小功能，然後模糊功能會被調用。它在其他瀏覽器中工作正常，但不能在Chrome中工作。 fiddle 模糊不適用於Chrome上的選擇菜單

重現錯誤：點擊打開選擇菜單和懸停定位標記，打開選擇菜單應關閉

<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>

來源

2013-05-22 Carlos

http://stackoverflow.com/questions/10851882/close-a-select-dropdown-list-programatically -with-javascript-jquery - 這裏的第二個答案似乎與鉻問題 – smerny

@amit有關。你能用'.blur（）'來解釋你想達到什麼嗎？ –

把焦點放在第一個 – Pinch

我有同樣的問題，這個想法很清楚：你不能模糊一個打開的select元素，因爲Chrome和Safari等待答案。但有一個解決方法，您可能會接受。

首先，當「select」仍然處於活動狀態時，您無法將焦點設置到另一個元素，因此我通過應用「display：none」將其刪除。之後，我觸發了另一個無害元素的點擊事件。然後我重新添加選擇回來，通過設置一個顯示：塊。在這種情況下，代碼會看起來像（我會添加一個跨度點擊）：

....... 
<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>

來源

2013-05-24 14:57:46 ATud

這是很好的把戲 – Carlos

它不影響可訪問性將焦點放到隨機元素中嗎？看起來你似乎擱置了通過元素進行選擇的用戶。有無障礙友好型解決方案嗎？ – AJFarkas

這個伎倆。 '$（「select」）。blur（）'在IE，Edge和Chrome中工作 - 但不是Firefox。 ''（「select」）。css（{「display」：「none」}）。blur（）。css（{「display」：「inline」}）;'做了所有這些。 –

-1

您需要使用.trigger()爲

<select id="selectboxId"> 
....... 
</select> 

    $ ('#selectboxId').trigger('blur');

來源

2013-05-22 11:33:41 PSR

爲什麼downvote.Please給methe理由 – PSR

我沒有downvote ..但'.. .blur（）'是'.trigger（'blur'）的快捷方式'參見api' - >'http://api.jquery.com/blur/ –

不，當我們想要用手動模糊事件時，我們會使用觸發器 – PSR

模糊不適用於Chrome上的選擇菜單

回答

相關問題