Los eventos de clic en un cuadro de diálogo jQuery ocurren dos veces?

Question

He estado lidiando con un extraño problema de que los eventos .click() suceden dos veces cuando se colocan en un cuadro de diálogo de jQuery.

Mi caso simple prueba está por debajo y una 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

Mover el bloque <script> que registra el evento click fuera de la popup div, creo que la JS se analiza en otro momento cuando el div se hace visible .. .

Answer 2

La razón más común, por qué sucede esto, es que el script se analiza 2 veces. Si no está seguro, donde sucede esto o no tiene tiempo para depurar, aquí hay una solución simple.

La idea es eliminar todas las hadlers activos, antes de aplicar una nueva hadler.

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

Si utiliza jQuery 1.7 o superior, puede utilizar la siguiente sintaxis.

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