点击按钮显示隐藏DIV，点击DIV外面隐藏DIV
注意：此方法对touch事件不行，因为stopPropagation并不能阻止touchend的冒泡
<style type="text/css">
body
{
background-color:#999999;
} #myDiv
{
background-color:#FFFFFF;
width:250px;
height:250px;
display:none;
}
</style>
<body>
<input id="btn" type="button" value="显示DIV" /> <div id="myDiv">
This is a div;
</div>
<script type="text/javascript">
var myDiv = $("#myDiv");
$(function (){
$("#btn").click(function (event){
if($(myDiv).is(":hidden")){
showDiv();//调用显示DIV方法
$(document).on("click", function () {//对document绑定一个影藏Div方法
$(myDiv).hide();
});
event.stopPropagation();//阻止事件向上冒泡
}else{
$(myDiv).hide();
} }); $(myDiv).click(function (event)
{
event.stopPropagation();//阻止事件向上冒泡
});
});
function showDiv(){
$(myDiv).slideDown("300");
}
</script>
</body>