当一个HTML元素需要添加mouseon、mouseout与click事件，或者mouserenter、mouseleave和click事件时，click事件无法触发
针对上述问题，我遇到的有两种情况：
情况一：已经存在的HTML元素绑定事件，可以使用下面这种绑定方式
$("button").mouseon(function(){
$("p").text("滑入");
}).click(function(){
$("p").text("点击");
});
或者：
$("button").mouseout(function(){
$("p").text("滑出");
}).click(function(){
$("p").text("点击");
});
或者：
$("button").hover(function(){
$("p").text("滑过");
}).click(function(){
$("p").text("点击");
});
情况二：未来存在的要素绑定事件，可以使用下面这种绑定方式
$("button").live("hover click",function(event){
$("span").text(event.type);
if(event.type=="mouseenter"){
$("p").text("滑进");
}
if(event.type=="mouseleave"){
$("p").text("滑出");
}
if(event.type=="click"){
$("p").text("点击");
}
});
下面是完整的测试代码：
<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").live("hover click",function(event){ $("span").text(event.type); if(event.type=="mouseenter"){ $("p").text("滑进"); } if(event.type=="mouseleave"){ $("p").text("滑出"); } if(event.type=="click"){ $("p").text("点击"); } }); }); </script> </head> <body> <p>这是一个段落。</p> <span>显示触发的事件。</span> <button>请点击这里</button> </body> </html>