补充一种做法并不使用contains，而是利用事件冒泡。在出现d窗（是指同一页面的浮层吧？）的同时，给document绑定点击事件，在事件处理函数内关闭这个d窗。然后，也给这个d窗元素绑定一个点击事件，在事件处理函数内阻止冒泡（eventstopPropagation()和eventcancelBubble=true）。
因为页面内任何地方的点击，正常都可以冒泡到document，然后关闭这个d窗。然后只有d窗阻止了这个冒泡，所以也达到了仅点击d窗（及其子元素）之外的空白区域来关闭d窗。
1、首先下载EasyUI的组件包，然后导入到开发工具中并且在HTML页面导入jquery脚本。
2、接下来需要导入的easyui的脚本文件，如下图所示，一定先导入jquery后导入easyui。
3、然后需要导入的是easyui的样式文件，如下图所示，样式文件只需要easyuicss即可。
4、接下来还需要导入的是语言文件，不导入的话可能会导致一些组件是英文。
5、接下来在body中定义一个div，然后给它一个easyui-dialog的样式。
6、然后运行页面，就会在页面中看到一个dialog的d出窗口了，就可以关闭对话框了。
这篇文章主要介绍了jQuery
scroll事件实现监控滚动条分页简单示例,使用ajax加载,同时介绍了(document)height()与$(window)height()的区别,需要的朋友可以参考下
scroll事件适用于window对象，但也可滚动iframe框架与CSS overflow属性设置为scroll的元素。
复制代码
代码如下:
$(document)ready(function () {
//本人习惯这样写了
$(window)scroll(function () {
//$(window)scrollTop()这个方法是当前滚动条滚动的距离
//$(window)height()获取当前窗体的高度
//$(document)height()获取当前文档的高度
var bot = 50;
//bot是底部距离的高度
if ((bot + $(window)scrollTop()) >=
($(document)height() - $(window)height())) {
//当底部基本距离+滚动的高度〉=文档的高度-窗体的高度时；
//我们需要去异步加载数据了
$getJSON("url", { page: "2" }, function (str) { alert(str); });
}
});
});
注意：(window)height()和(document)height()的区别
jQuery(window)height()代表了当前可见区域的大小，而jQuery(document)height()则代表了整个文档的高度，可视具体情况使用
注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window)height()
随之改变，但是jQuery(document)height()是不变的。
复制代码
代码如下:
$(document)scrollTop() 获取垂直滚动的距离
即当前滚动的地方的窗口顶端到整个页面顶端的距离
$(document)scrollLeft() 这是获取水平滚动条的距离
要获取顶端 只需要获取到scrollTop()==0的时候 就是顶端了
要获取底端 只要获取scrollTop()>=$(document)height()-$(window)height()
就可以知道已经滚动到底端了
复制代码
代码如下:
$(document)height()
//是获取整个页面的高度
$(window)height() //是获取当前 也就是你浏览器所能看到的页面的那部分的高度
这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的 根据英文应该也能理解吧
自己做个实验就知道了
复制代码
代码如下:
$(document)scroll(function(){
$("#lb")text($(document)scrollTop());
})
<span id="lb"
style="top:100px;left:100px;position:fixed;"></span><!--一个固定的span标记
滚动时方便查看-->
当正在离开一个页面或正在卸载一个页面时，unload事件将会被激活，然而不管怎样，此事件不能够阻止页面的离开。
$(window)bind('unload',function(){});
从jquery 14起，你能够绑定beforeunload 事件给$(window) 对象来阻止页面的离开，卸载或导航到其它站点。
$(window)bind('beforeunload',function(){
return'';
});
随着beforeunload事件被绑定，当你关闭此页面，点击回退按钮或刷新此页面，一个确认提升框会被d出，用来询问你是否真正想做。选择ok 用来离开页面，cancel 用来阻止页面的离开，使其保持在相同的页面。
另外 ，你被允许添加自己的学习到确认提示框（box）中：
$(window)bind('beforeunload',function(){
return'>>>>>Before You Go<<<<<<<< \n Your custom message go here';
});
注意beforeunload 事件是从jquery 14版本才开始支持的。
以下是完整代码
<html>
<head>
<meta >
/
加载执行关闭
/
$(
function () {
click();
} );
function click(){
$(#ddd")trigger('click');
}
这样行吗？试试
你看一下layer的官方演示里边就有在iframe中关闭自身的例子
在你上面的“页面”中，在你提交表单后执行
var index = parentlayergetFrameIndex(windowname); //获取当前窗体索引$('#提交的元素')on('click', function(){
parentlayerclose(index); //执行关闭
});
你可能需要修改上面的"submit"提交为button提交
以上就是关于如何使用JavaScript（非jQuery）实现点击页面空白后关闭d窗全部的内容，包括:如何使用JavaScript（非jQuery）实现点击页面空白后关闭d窗、jquery easyui 中dialog怎么关闭对话框、请教jquery的$window.scroll事件等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）