·您现在的位置: 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设开发 >> ASP.NET网站开发 >> z-index解决弹出层遮罩层覆盖子div不能显示输出的问题

z-index解决弹出层遮罩层覆盖子div不能显示输出的问题

作者:佚名      ASP.NET网站开发编辑:admin      更新时间:2022-07-23

z-index解决弹出层遮罩层覆盖子div不能显示输出的问题

// 添加以下代码来进行测试:// Ajax 发生错误,就会执行$('body').ajaxError(function(e, xhr, setting, text){ // e - event 事件 // xhr - xmlHttPRequest 对象 // setting - ajax 设置 // text - 错误信息 alert(text);});// ajax 完成后,就会执行$('body').ajaxComplete(function(){ alert('complete'); // ajax 请求完成就会执行})$.ajax({ url: '/sms/AjaxSMS.ashx', type: "POST", data: "txtcontent=" + content+"&txtback=" + content2+"", async: false, success: function(data) { if (data == "成功" || data == "[object XMLDocument]") { IsAddSuffix(hdtatolSMS, arr, mob); //后缀名 confirm("您本次发送短信数量为:" + (parseInt(hdtatolSMS) * arr.length) + ",确认发送吗?"); } else { alert(content + "可能涉及广告类、营销类等系统不允许发送的内容,请修改后再发送。"); } }, error: function(a) { alert(a.responseText); } });//添加后缀判断function IsAddSuffix(data, arr, mob) { var txtBack = document.getElementById("ctl00_ContentPlaceHolder1_txtBack").value; if (txtBack == "") { confirm("后缀为空,您本次发送短信数量为:" + (parseInt(data) * arr.length) + ",确认发送吗?"); } else { if (txtBack.length + mob.value.length > maxnums - 1) { alert("内容加上后缀(系统自动补充空格)长度不能起过" + maxnums + "个字符,请重新输入!"); } }}

<script type="text/javascript" language="Javascript"> $(function() { //弹出提示框(快旅新域名) var isRead = getHCookie('warnTips'); if (isRead == null) { popupDiv('pop-div'); } function popupDiv(div_id) { var div_obj = $("#" + div_id); var windowWidth = document.documentElement.clientWidth; var windowHeight = document.documentElement.clientHeight; var popupHeight = div_obj.height(); var popupWidth = div_obj.width(); //添加并显示遮罩层 $("<div id='mask'></div>").addClass("mask") .width(windowWidth * 0.99) .height(windowHeight * 0.99) //.CSS({ "position": "absolute", "background": "#CCCCCC", "left": "0px", "top": "0px", "zIndex": "1", "filter": "Alpha(Opacity=60)" })遮盖层 .css({ "position": "absolute" }) .click(function() { hideDiv(div_id); }) .appendTo("body") .fadeIn(200); div_obj.css({ "position": "absolute" }) .animate({ left: windowWidth / 2 - popupWidth / 2, top: windowHeight / 2 - popupHeight / 2, opacity: "show" }, "slow"); } }); function hideDiv(div_id) { $("#mask").remove(); $("#" + div_id).animate({ left: 0, top: 0, opacity: "hide" }, "slow"); //记录cookie SetHCookie('warnTips', 'read'); //window.parent.del(); } function SetHCookie(name, value)//两个参数,一个是cookie的名称,一个是值 { var Days = 1; //此 cookie 将被保存 1 天 var exp = new Date(); exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString(); } function getHCookie(name)//取cookies函数 { var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)")); if (arr != null) return unescape(arr[2]); return null; } function delHCookie(name)//删除cookie { var exp = new Date(); exp.setTime(exp.getTime() - 1); var cval = getHCookie(name); if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString(); } </script>

z-index遮罩层的光标输入方案:遮罩层问题。必须设置z-index,必须小于父div元素的数值,不然会失去效果。