<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#p1").click(function(event){
alert(event.currentTarget === this);
});
$("#p2,#p3").each(function(i){
$(this).on("click",{x:i},function(event){
alert("序号:" + $(this).index() + "。段落的数据为: " + event.data.x);
});
});
$("div").on("click","button",function(event){
$(event.delegateTarget).css("background-color", "pink");
});
$("a").click(function(event){
event.preventDefault();
alert("检查 preventDefault() 是否被调用: " + event.isDefaultPrevented());
});
$("div").click(function(event){
event.stopImmediatePropagation();
alert("检测 event.stopImmediatePropagation() 是否被调用: " + event.isImmediatePropagationStopped());
});
$("p").bind("test.something", function(event) {
alert( event.namespace ); });
$("button").click(function(event) {
$("p").trigger("test.something");
});
$(document).bind(‘mousemove‘,function(e){
$("#zong").text("e.pageX: " + e.pageX );
});
$(document).bind(‘mousemove‘,function(e){
$("#zong2").text(" e.pageY: " + e.pageY);
});
});
</script>
</head>
<style>
</style>
<body>
<p id="p1">点击弹出</p>
<p id="p2">点击弹出</p>
<p id="p3">点击弹出</p>
<div style="background:red;">
<p>点击DIV检测</p>
<button>更改背景颜色</button>
</div>
<a href="#" style="text-decoration:none;">检测</a>
<br />
<button>点击弹p</button>
<div id="zong"></div>
<div id="zong2"></div>
</body>
</html>
原文:http://www.cnblogs.com/yjh1604600160/p/x9.html