Javascript 为什么Jquery代码被多次激发

Javascript 为什么Jquery代码被多次激发,javascript,jquery,Javascript,Jquery,我有一个按钮,可以从另一个页面打开一个模式。如果单击了.myBtn,则模式打开。模式按预期关闭,我会收到一个单击警报,但当再次按下打开模式时,我会收到两个单击警报,因为模式关闭。为什么会这样?我如何保持dom中的所有元素“正常工作”,但避免多次触发脚本?非常感谢 Html Modal_test.php(部分) 拯救 接近 因为(见注释): 您可以在单击事件处理之外安全地绑定它 $(document).ready(function() { //Open Modal $('.c

我有一个按钮,可以从另一个页面打开一个模式。如果单击了
.myBtn
,则模式打开。模式按预期关闭,我会收到一个单击警报,但当再次按下
打开模式
时,我会收到两个单击警报,因为模式关闭。为什么会这样?我如何保持dom中的所有元素“正常工作”,但避免多次触发脚本?非常感谢

Html

Modal_test.php(部分)


拯救
接近
因为(见注释):

您可以在单击事件处理之外安全地绑定它

$(document).ready(function() { 
    //Open Modal
    $('.credit_btn').on('click', function() {    
        $('.modal-container').load('modal_test.php',
           function() {
               $('#myModal').modal({show:true});
           }
       );
   });
   $(document).on("click", ".myBtn", function(){
       alert('click');
   });
});
(虽然我会将该类从“myBtn”重命名为“closeModal”或类似的名称,但在编写代码时要具体一些;)

因为(请参见注释):

您可以在单击事件处理之外安全地绑定它

$(document).ready(function() { 
    //Open Modal
    $('.credit_btn').on('click', function() {    
        $('.modal-container').load('modal_test.php',
           function() {
               $('#myModal').modal({show:true});
           }
       );
   });
   $(document).on("click", ".myBtn", function(){
       alert('click');
   });
});

(虽然我会将该类从“myBtn”重命名为“closeModal”或类似的名称,但在编写代码时要特别注意;))

谢谢,但这似乎不起作用。不要在另一个
onclick
中放置
onclick
。谢谢,但这似乎不起作用。不要在另一个
onclick
中放置
onclick
。这太棒了,非常感谢你的精彩解释。太棒了,非常感谢你的精彩解释。
         <button type="submit" id="btn"  data-dismiss="modal" value="submit" class="btn btn-blue pull-right myBtn">
            Save</button>
             <button type="button" class="btn btn-red pull-left" data-dismiss="modal">Close</button>
              </form>
    </div><!-- /.modal-footer -->
$('.credit_btn').on('click', function() {    
   // Everytime you click on .credit_btn
   // ...
   // You bind that event again (and again and again)
   $(document).on("click", ".myBtn", function(){
       alert('click');
   });
});
$(document).ready(function() { 
    //Open Modal
    $('.credit_btn').on('click', function() {    
        $('.modal-container').load('modal_test.php',
           function() {
               $('#myModal').modal({show:true});
           }
       );
   });
   $(document).on("click", ".myBtn", function(){
       alert('click');
   });
});