<input id="btnClick" type="button" value="原生写法" class="btn-green radius" />
<div id="pop" class="centerDiv radius" style="width: 260px; height: 100px; border:1px solid #ddd; background:#f7f7f7; color:#000;">
当点击按钮后显示隐藏层,满足鼠标在div里操作不隐藏,在外边点击会消失的功能。
逻辑上主要是阻止浏览器的冒泡<br />
</div>
<script type="text/JavaScript">
//点击#btnClick时要阻止冒泡,否则.pop是不显示的,
//因为冒泡了,会执行到下面的方法。
function stopPropagation(e) {
var ev = e || window.event;
if (ev.stopPropagation) {
ev.stopPropagation();
}
else if (window.event) {
window.event.cancelBubble = true;//兼容IE
}
}
$("#btnClick").click(function (e) {
$("#pop").show();
stopPropagation(e);
});
$(document).bind('click', function () {
$("#pop").hide();
});
$("#pop").click(function (e) {
stopPropagation(e);
});
</script>