JS函数只需点击一次即可触发两次

JS function triggering twice for only one click

本文关键字：两次 一次 函数 JS      更新时间：2024-02-14

场景：

功能一：

$(document).on('click','.select_lens_prescp_option',function(){  ....       });

功能二：

  $(document).on('click','.lens_manual_change',function(event){
    // event.preventDefault();
    $('#lens_edit_manual_change_'+
    $(this).data('suborder')+",#contacts_prescription_manual_change_"+
    $(this).data('suborder')+
    ",#lens_save_manual_change_"+$(this).data('suborder')).toggle('slow');
  });

现在我想在类lens_manual_change的点击事件中做同样的功能，但通过类select_lens_prescp_option的点击事件

$(document).on('click','.select_lens_prescp_option',function(){
  ....
  if(form.find('.lens_form_fields').is(':hidden')){
      form.find('.lens_manual_change').trigger('click');   // this is the step I performed
    }
});

问题：第一个函数被触发两次。

内部事件处理程序中的event.stopPropagation()函数将起作用。 

$('.first').on('click', function(){
	alert(1);
});
$('.second').on('click', function(event){
	event.stopPropagation();
	alert(2);
});
.first{
  width:200px;
  height:200px;
  background-color:white;
}
.second{
  width:100px;
  height:100px;
  position: relative;
  margin: 0 auto;
  top:50px;
  background-color:black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class='first'>
  <div class='second'>
  </div>
</div>

文档

相关文章：