Rumah > Artikel > hujung hadapan web > Mengklik di luar kawasan div untuk menyembunyikan kemahiran div area_javascript yang dilaksanakan oleh js

Mengklik di luar kawasan div untuk menyembunyikan kemahiran div area_javascript yang dilaksanakan oleh js

WBOYasal: 2016-05-16 16:42:531486semak imbas

Mula-mula, mari kita lihat model acara JS Model acara JS menggelegak ke atas Contohnya, selepas peristiwa onclick dicetuskan pada elemen DOM tertentu, peristiwa itu akan merambat ke atas mengikut nod sehingga peristiwa klik. terikat pada nod induk tertentu, jika tidak ia akan pergi ke akar dokumen.

Cegah menggelegak: 1. stopPropagation() untuk pelayar bukan IE. 2. Atribut cancelBubble adalah benar, untuk pelayar IE,

Jquery sudah mempunyai kaedah yang serasi dengan penyemak imbas, event.stopImmediatePropagation();

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="js/jquery-1.4.4.min.js" ></script>
<title></title>
</head>
<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>

</body>

<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>

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Acara tatal takal mengikat JS asli serasi dengan kemahiran browsers_javascript biasaArtikel seterusnya：Acara tatal takal mengikat JS asli serasi dengan kemahiran browsers_javascript biasa

Artikel berkaitan

Lihat lagi