2010-06-29 83 views
5

我一直在處理一個奇怪的問題,即.click()事件發生兩次,每次放置在一個jQuery對話框中。jQuery對話框中的點擊事件發生兩次?

我簡單的測試用例低於和live example is here

<div id="popup" style="display: none"> 
    <a href="javascript:void(0);" id="testlink">Test Link</a> 
    <script type="text/javascript"> 
     $('#testlink').click(function(){ 
     alert("Test Link clicked"); 
     return 0; 
     }); 
    </script> 
    </div> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#popup').css('display','block'); 
    var h=($(window).height()+0.0)*0.9; 
    var w=($(window).width()+0.0)*0.9; 
    if(w >= 800){ 
     w = 800; 
    } 
    $('#popup').dialog({ 
     autoOpen: true, 
     width: w, 
     height: h, 
     modal: true, 
     open: function(event,ui){ 
     $('body').css('overflow', 'hidden'); 
     }, 
     close: function(event,ui){ 
     $('body').css('overflow', 'scroll'); 
     } 
    }); 
    }); 
    </script> 

回答

7

移動的<script>塊的popup DIV以外註冊的單擊事件,我認爲JS被解析另一個時候DIV變爲可見..

+0

嗯,修正它如下所示:http://jsbin.com/odago/2 – Earlz 2010-06-29 16:13:46

+0

呵呵。我沒有在您的超薄樣本中獲得本地運行的雙倍呼叫,但是我確實在您的機器上運行的實況樣本中獲得了該呼叫。您的示例網站還有一些額外的內容。 – a7drew 2010-06-29 16:56:28

+0

我在Chrome上測試過,有... – 2010-06-29 17:47:45

2

爲什麼會發生這種情況的最常見原因是您的腳本被解析了2次。如果您不確定,發生這種情況或者沒有時間進行調試,這裏有一個簡單的解決方法。

這個想法是在應用新的哈希器之前刪除所有活動的哈勒。

$('.selector').unbind('click').click(function() { 
    // your code 
}); 

如果您使用jQuery 1.7或更高版本,則可以使用以下語法。

$('.selector').off('click').on('click', function() { 
    // your code 
});