Дважды нажмите события в диалоговом окне jQuery?

Question

Я столкнулся с нечетной проблемой, когда события .click() происходят дважды, когда они помещаются в диалоговом окне 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> 

Answer 1

Переместить <script> блок, который регистрирует событие щелчка вне popup DIV, я думаю, что JS получает разобран в другой раз, когда ДИВ становится видимым ..

Answer 2

Наиболее распространенная причина, почему это происходит, заключается в том, что ваш скрипт анализируется 2 раза. Если вы не уверены, где это происходит или у вас нет времени на отладку, вот простой способ обхода.

Идея состоит в том, чтобы удалить всех активных адлер до того, как будет применен новый адлер.

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

Если вы используете jQuery 1.7 или выше, вы можете использовать следующий синтаксис.

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