点击按钮生成遮罩层后这个按钮被遮住还可以点击解决办法

Posted 酱板鸡

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了点击按钮生成遮罩层后这个按钮被遮住还可以点击解决办法相关的知识,希望对你有一定的参考价值。

     这个功能很特殊,我有篇随笔写的自助弹框,弹出框后,下面的按钮虽然有遮罩层但还是可以点,有一种解决方法就是用点击后就马上解绑按钮的点击事件,在弹框确定后再绑定上去。

 

          $(".regbtn")[0].addEventListener("touchstart",register);
		function register() {
			$(".regbtn")[0].removeEventListener("touchstart",register);

                        if(执行弹窗条件) {
			  $(".regbtn")[0].removeEventListener("touchstart",register);
			  var alertdiv = $(‘<div id="alertdiv" class="overlay" style="z-index: 99999; left: 0px;"><div class="phone-alert"><div class="phone-alert-panel"><div class="phone-alert-content">手机号已经被注册了</div><div class="phone-alert-line"></div><a href="javascript:void(0);" class="pbtn" id="confirmTag">确认</a></div></div></div>‘);
			  $("body").append(alertdiv);
			  $(document).on("touchstart","#confirmTag",function(){
			  $(".overlay").each(function(index, value){
				$(this).remove();
				$(".regbtn")[0].addEventListener("touchstart",register);
			  });
		       });

  

以上是关于点击按钮生成遮罩层后这个按钮被遮住还可以点击解决办法的主要内容,如果未能解决你的问题,请参考以下文章

做一个简单的遮罩层

弹出遮罩层后禁止滚动效果

1.解决小程序遮罩层遮住页面后滚动穿透问题

点击弹出居中带有透明遮罩层窗口:

浏览器遮罩层

javascript中 遮罩层是啥?