手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >DIV外区域Click后关闭DIV的实现代码
DIV外区域Click后关闭DIV的实现代码
摘要:阻止冒泡:1、stopPropagation()对于非IE浏览器。2、cancelBubble属性为true,对于IE浏览器,而Jquery...

阻止冒泡:

1、stopPropagation()对于非IE浏览器。

2、cancelBubble属性为true,对于IE浏览器,

而Jquery已经有兼容浏览器的方法,event.stopImmediatePropagation();

复制代码 代码如下:

<style>

body

{

background:black;

}

#myDiv

{

background: #fff;

width:250px;

height:250px;

display:none;

}

</style>

<div id="myDiv">

This is a div;

</div>

<input id="btn" type="button" value="显示DIV" />

<script type="text/javascript">

var myDiv = $("#myDiv");

$(function () {

$("#btn").click(function (event) {

showDiv();//调用显示DIV方法

$(document).one("click", function () {//对document绑定一个影藏Div方法

$(myDiv).hide();

});

event.stopPropagation();//阻止事件向上冒泡

});

$(myDiv).click(function (event) {

event.stopPropagation();//阻止事件向上冒泡

});

});

function showDiv() {

$(myDiv).fadeIn();

}

</script>

【DIV外区域Click后关闭DIV的实现代码】相关文章:

打印/预览/设置的客户端代码

自动关闭的层

本窗口将在秒后自动关闭

CSS+JS实现点击文字弹出定时自动关闭DIV层菜单的方法

必须点击广告才能进入的代码

jQuery实现div随意拖动的实例代码(通用代码)

JS实现定时自动关闭DIV层提示框的方法

获取阴历(农历)和当前日期的js代码

JS动画效果打开、关闭层的实现方法

剖析Node.js异步编程中的回调与代码设计模式

精品推荐
分类导航