jQuery弹出窗口仅在第二次单击时打开

时间:2020-04-30 23:27:52

标签: javascript html jquery

/* action dropdown*/
jQuery(document).ready(function(){
  jQuery(".action-toggler").click(function(ev){
    jQuery(this).children(".action-dropdown").toggle();
    ev.stopPropagation();
  });
		
  jQuery("body").click(function(){
    jQuery(".action-dropdown").hide();
  });
});

/* modle-popup*/
jQuery(document).ready(function(){
  jQuery(".popup-button").click(function(){
    event.preventDefault();
    jQuery("body").addClass("sitemodal-open");
    jQuery(".sitemodal").addClass("in");
  });

  jQuery('.sitemodal .sitemodal-dialog').click(function($){
    $.stopPropagation();
  });

  jQuery(".close-popup ,.sitemodal").click(function(){
    jQuery("body").removeClass("sitemodal-open");
    jQuery(".sitemodal").removeClass("in");
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <span class="msg-icon action-toggler" style="float:right;">
    <img src="images/dots.png" ></img>
    <ul class="action-dropdown">								
      <li>
        <a class="popup-button" data-target="#delete-popup" >Delete</a>
        <!-- siteModal content-->
        <div class="sitemodal fade" id="reply-popup">
	        <div class="sitemodal-dialog">
            <div class="sitemodal-content">
              <div class="sitemodal-header">
                <h4 class="sitemodal-title">Delete</h4>
	            </div>
		          <hr style="margin-top: 8px;margin-bottom:2px;">
			        <div class="sitemodal-body" style="padding: 16px 0;">
		            <h4 class="sitemodal-title" style="font-size: 16px;font-weight: 400;">Are you sure you want to delete this message?</h4>
		            <form enctype="multipart/form-data" method="Post" action="" name="" onsubmit="">
		              <hr style="margin-top: 16px;margin-bottom:2px;">
				          <div class="sitemodal-footer" style="display: flex;margin-bottom: -8px;">
                    //php code here
	                </div>
		            </form>
	            </div>
            </div>
          </div>
        </div>
      </li>
    </ul>							
  </span>

我有一个下拉菜单,单击它时包含一个“删除”选项,它显示一个弹出窗口

我遇到的问题是,当单击“删除”选项时,第一次没有发生任何事情,但是当第二次单击时,弹出窗口显示

试图从“模型弹出”中触发下拉窗口,但没有成功

试图删除</ul>之外的弹出窗口,但没有成功

能不能给我一个提示,否则我至少会出错

删除了一些无关的代码,以便于阅读

0 个答案:

没有答案