W3Schools 在线编辑工具（TIY） V3.0
编辑的代码:
运行代码 »
©
w3s.com.cn
<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> x=0; y=0; $(document).ready(function(){ $("div.out").mouseout(function(){ $(".out span").text(x+=1); }); $("div.leave").mouseleave(function(){ $(".leave span").text(y+=1); }); }); </script> </head> <body> <p>不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。</p> <p>只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。</p> <div class="out" style="background-color:lightgray;padding:20px;width:40%;float:left"> <h2 style="background-color:white;">被触发的 Mouseout 事件：<span></span></h2> </div> <div class="leave" style="background-color:lightgray;padding:20px;width:40%;float:right"> <h2 style="background-color:white;">被触发的 Mouseleave 事件：<span></span></h2> </div> </body> </html>