Primero, veamos el modelo de eventos JS. El modelo de eventos JS está burbujeando hacia arriba. Por ejemplo, después de activar un evento OnClick, el evento seguirá el nodo para propagarse hacia arriba hasta que un evento de clic esté vinculado a un nodo principal. Si no llega a la raíz del documento.
Para detener las burbujas: 1. StopPropagation () para navegadores que no son II. 2. El atributo CancelBubble es verdadero. Para IE Browser,
JQuery ya tiene un método compatible con el navegador, 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:#9999999;}#myDiv {background-color: #fffff; ancho: 250px; altura: 250px; display: none; } </style> <body> <input id = "btn" type = "button" value = "show div"/> <div id = "myDiv"> Esto es un div; </div> </body> <script type = "text/javaScript"> var myDiv = $ ("#myDiv"); $ (function () {$ ("#btn"). click (función (función (evento) {; Div Method $ (Document) .One ("Click", function () {// Bind a Shadow Div Method $ (myDiv) .Hide ();}); Event.StopPropagation (); // Detenga el evento a Bubble Up}); $ (MyDiv) .Click (Function (Event) {Event.StopPagation (); // Detenga el evento de Bubble upward});});});});});}); función showDiv () {$ (myDiv) .fadeIn ();} </script>