jquery blockUI 遮罩不能消失与不能提交的解决方法


Posted in Javascript onSeptember 17, 2011
//显示遮罩 
$.blockUI({ 
message: $('#divlogin'), 
css:{width:"400px", height:"255px", top: ($(window).height() - 400) /2 + 'px', left: ($(window).width() - 400) /2 + 'px'} 
}); 
//取消遮罩 
$("#cancel").click(function() { 
$.unblockUI(); 
});

取消遮罩是,js 动态生成的外层没有消失。
在FF3.0.4,Chrome下都没问题,只是 IE6 IE7 Ie8下不正常。
打开源码,找到了下面这句话:
var lyr1 = ($.browser.msie) ? $('<iframe class="blockUI" style="z-index:'+ z++ +';border:none;margin:0;padding:0;position:absolute;width:100%;height:100%;top:0;left:0" src="javascript:false;"></iframe>') 
: $('<div class="blockUI" style="display:none"></div>');

可以看到,在IE下,它是生成了一个 iframe,并在这个 iframe 中加载你自己的对话框。
那么,现在只是外层不消失,自己手动让它消失。
$.blockUI({ message: $("#dialog")}); 
$("#cancel").click(function() { 
$.unblockUI(); 
$(".blockUI").fadeOut("slow"); 
});

OK,IE6 IE7都可以了。
使用blockui后,遮罩层数据不能提交到后台了,使用ajax可以
要提交到后来,请教后明白,遮罩层不再当前form中,所以提交后没有form不能提交
解决办法,把遮罩层部分,放置到form中
$('#divlogin').parent().appendTo(jQuery("form:first"));---还为完全找到放到form外面的遮罩层数据,所以不是很清楚。
Javascript 相关文章推荐
JavaScript(js)设置默认输入焦点(focus)
Dec 28 Javascript
js身份证判断方法支持15位和18位
Mar 18 Javascript
javascript实现画不相交的圆
Apr 07 Javascript
node.js中module.exports与exports用法上的区别
Sep 02 Javascript
jQuery与JavaScript节点创建方法的对比
Nov 18 Javascript
JS排序之快速排序详解
Apr 08 Javascript
利用angular自动编译andriod APK的绕坑经历分享
Mar 08 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
May 26 Javascript
ionic4+angular7+cordova上传图片功能的实例代码
Jun 19 Javascript
JavaScript 实现页面滚动动画
Apr 24 Javascript
JavaScript实现简单计时器
Jun 22 Javascript
基于JavaScript实现年月日三级联动
Jun 22 Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
Sep 16 #Javascript
asp.net 30分钟掌握无刷新 Repeater
Sep 16 #Javascript
jquer之ajaxQueue简单实现代码
Sep 15 #Javascript
js substr、substring和slice使用说明小记
Sep 15 #Javascript
javascript 闭包
Sep 15 #Javascript
用JQuery模仿淘宝的图片放大镜显示效果
Sep 15 #Javascript
document.getElementById介绍
Sep 13 #Javascript
You might like
overlord人气高涨,却被菲利普频繁举报,第四季很难在国内上映
2020/05/06 日漫
php代码审计比较有意思的例子
2014/05/07 PHP
php接口技术实例详解
2016/12/07 PHP
修改yii2.0用户登录使用的user表为其它的表实现方法(推荐)
2017/08/01 PHP
JavaScript ( (__ = !$ + $)[+$] + ({} + $)[_/_] +({} + $)[_/_] )
2011/02/25 Javascript
Underscore.js 的模板功能介绍与应用
2012/12/24 Javascript
JavaScript的React框架中的JSX语法学习入门教程
2016/03/05 Javascript
详解基于webpack和vue.js搭建开发环境
2017/04/05 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
2017/06/23 jQuery
浅谈Vue父子组件和非父子组件传值问题
2017/08/22 Javascript
angular4 如何在全局设置路由跳转动画的方法
2017/08/30 Javascript
使用mint-ui开发项目的一些心得(分享)
2017/09/07 Javascript
JS分页的实现(同步与异步)
2017/09/16 Javascript
AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
2017/10/25 Javascript
在一个页面实现两个zTree联动的方法
2017/12/20 Javascript
JS简单实现查看文档创建日期、修改日期和文档大小的方法示例
2018/04/08 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
js实现一款简单踩白块小游戏(曾经很火)
2019/12/02 Javascript
原生js拖拽实现图形伸缩效果
2020/02/10 Javascript
Python中的元类编程入门指引
2015/04/15 Python
Python3 操作符重载方法示例
2017/11/23 Python
python根据txt文本批量创建文件夹
2020/12/08 Python
Python collections.defaultdict模块用法详解
2020/06/18 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
Python自动登录QQ的实现示例
2020/08/28 Python
Scrapy 配置动态代理IP的实现
2020/09/28 Python
Django中的DateTimeField和DateField实现
2021/02/24 Python
html5.2 dialog简介详解
2018/02/27 HTML / CSS
T3官网:头发造型工具
2019/12/26 全球购物
个人简历自我评价八例
2013/10/31 职场文书
手机业务员岗位职责
2013/12/13 职场文书
四风问题自我剖析材料
2014/10/07 职场文书
乐山大佛导游词
2015/02/02 职场文书
vue实现简单数据双向绑定
2021/04/28 Vue.js
清空 Oracle 安装记录并重新安装
2022/04/26 Oracle
CSS 实现磨砂玻璃(毛玻璃)效果样式
2023/05/21 HTML / CSS