<!doctype html><html lang="us"><head><meta charset="utf-8"><title> test</title><script src="./jquery-1.10.2.js" type="text/javascript"></script><script>function initEvents(){//注册多次事件方法初始化initOnEvent();initBindEvent();initClickvent();initLiveEvent();//只注册一个事件方法oneEventByBindUnBind();oneEvnetByDieLive();}function initOnEvent(){//为id为onWayToEvent 按钮注册点击事件$("#onWayToEvent").on("click",function(){alert("this is one on event")});$("#onWayToEvent").on("click",function(){alert("this is two on event")});$("#onWayToEvent").on("click",function(){alert("this is three on event")});}function initBindEvent(){//为id为bindWayToEvent 的按钮注册点击事件$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. one")});$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. two")});$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. three")});}function initClickvent(){$("#clickWayToEvent").click(function(){alert("this is registry event by click. one");});$("#clickWayToEvent").click(function(){alert("this is registry event by click. two");});$("#clickWayToEvent").click(function(){alert("this is registry event by click. three");});}function initLiveEvent(){$("#liveWayToEvent").live("click",function(){alert("this is registry event by click. one");});/*$("#clickWayToEvent").click(function(){alert("this is registry event by click. two");});$("#clickWayToEvent").click(function(){alert("this is registry event by click. three");});*/}function oneEventByBindUnBind(){registryManyEvent("oneEvnetByBind");$("#oneEvnetByBind").unbind("click").bind("click",function(){alert("only you !!!!!!!");});}function oneEvnetByDieLive(){registryManyEvent("oneEvnetByDieLive");$("#oneEvnetByDieLive").die().live("click",function(){alert("the one of you !!!!!!");});}function registryManyEvent(id){$("#"+id).click(function(){alert("this is registry event by common. one");});$("#"+id).click(function(){alert("this is registry event by common. two");});$("#"+id).click(function(){alert("this is registry event by common. three");});}</script><style>.info{width:100%;height:auto;float:auto;margin:10px;}</style></head><body onload="initEvents()"><h1>Welcome to jquery registry event test</h1><button id="onWayToEvent" >通过on的方式多次注册事件</button> </br><div class="info">通过 on方法注册的事件，每次的注册不会把原来的方法覆盖掉。会以队列的形式保存起来点击的时候，触发事情会一个个按注册的顺序执行。主要代码：function initOnEvent(){//为id为onWayToEvent 按钮注册点击事件$("#onWayToEvent").on("click",function(){alert("this is one on event")});$("#onWayToEvent").on("click",function(){alert("this is two on event")});$("#onWayToEvent").on("click",function(){alert("this is three on event")});}</div><button id="bindWayToEvent">通过bind的方法多次注册事件</button><div class="info" >通过 jquery 的bind方法多次注册的方法也是一样，不会把原来的方法覆盖了，，也是把方法以队列的形式保存起来，触发事件后按注册次序逐个执行。主要代码：function initBindEvent(){//为id为bindWayToEvent 的按钮注册点击事件$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. one")});$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. two")});$("#bindWayToEvent").bind("click",function(){alert("this is registry event by bind. three")});}</div><button id="clickWayToEvent">通过click方法多次注册事件</button><div class="info" >通过 jquery 的click方法多次注册的方法也是上面的效果一样 。主要代码：function initClickvent(){$("#clickWayToEvent").click(function(){alert("this is registry event by click. one");});$("#clickWayToEvent").click(function(){alert("this is registry event by click. two");});$("#clickWayToEvent").click(function(){alert("this is registry event by click. three");});}</div><button id="liveWayToEvent">通过live 方法多次注册事件</button><div class="info" >要怎么样才能把前面的事件给覆盖掉，只保留最后注册的事件方法?</div><button id="oneEvnetByBind">通过unbind,bind方法进行事件的唯一注册</button><div class="info">这个方法可以行得通主要代码：function oneEventByBindUnBind(){registryManyEvent("oneEvnetByBind");$("#oneEvnetByBind").unbind("click").bind("click",function(){alert("only you !!!!!!!");});}function registryManyEvent(id){$("#"+id).click(function(){alert("this is registry event by common. one");});$("#"+id).click(function(){alert("this is registry event by common. two");});$("#"+id).click(function(){alert("this is registry event by common. three");});}</div><button id="oneEvnetByDieLive">通过 die live 方法进行事件的唯一加载</button><div class="info">我们用的 jquery-1.10.2.js 这里没有提供 die live 方法。对于网上提供的这个方法是无效的。主要代码：function oneEvnetByDieLive(){registryManyEvent("oneEvnetByDieLive");$("#oneEvnetByDieLive").die().live("click",function(){alert("the one of you !!!!!!");});}function registryManyEvent(id){$("#"+id).click(function(){alert("this is registry event by common. one");});$("#"+id).click(function(){alert("this is registry event by common. two");});$("#"+id).click(function(){alert("this is registry event by common. three");});}</div></body></html>
人创造奇迹常常是在瞬间，
