在Safari中未觸發JQuery Click事件？

我想要做一些事情，當用戶從選擇框中選擇一個選項 - 儘可能簡單？我使用JQuery 1.3.1來註冊一個帶有選擇框ID的點擊處理程序。一切都很好，直到我使用Chrome和Safari進行測試，發現它不起作用。在Safari中未觸發JQuery Click事件？

火狐3.05 - YES
IE 7.0.5730.13 - YES
IE6Eolas - YES
Sarafi 3.2.1 - NO
鉻1.0.154.43 - NO

見代碼如下：

<html> 
<head> 
    <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> 
    <script language="javascript"> 
    $(document).ready(function(){ 
     $('#myoption').click(function() { alert('Select Dropdown was clicked: '+ $('#myoption').val()); }); 
    });  
    </script> 
</head> 
<body> 
    <select id="myoption"> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    </select> 
</body> 
</html>

任何人都知道我應該爲此工作做什麼？警報最終會被觸發，但只有在雙擊選擇框後纔會觸發警報。

來源

2009-01-23 Tom

我發現我的問題。對於選擇框，您需要爲「更改」事件註冊處理程序，而不是「點擊」事件。 Firefox和IE使用click事件很奇怪。

綜上所述，下面的代碼工作在所有瀏覽器：

<html> 
<head> 
    <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> 
    <script language="javascript"> 
    $(document).ready(function(){ 
     $('#myoption').change(function() { alert('Select Dropdown was clicked: '+ $('#myoption').val()); }); 
    });   
    </script> 
</head> 
<body> 
    <select id="myoption"> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    </select> 
</body> 
</html>

來源

2009-01-23 08:35:09 Tom

我認爲「更改」在IE中不起作用。 IIRC，它在元素失去焦點之前不被觸發。 – Tomalak 2009-01-23 08:42:57

Safari和Chrome都是基於WebKit瀏覽器。 Webkit使用操作系統中的本機下拉元素，而不是自己實現下拉列表，不幸的是，本地下拉列表不支持點擊事件。出於同樣的原因，他們也不支持CSS選項元素或其他整潔的技巧。

唯一能夠讓這些工作的跨瀏覽器的方式是使用<ul>以及大量的javascript來實現這個功能。

來源

2010-06-21 17:40:11

在Safari中未觸發JQuery Click事件？

回答

相關問題