綁定其實就是把一些常規時間綁定到頁面，然后進行各種常規操作
解綁就是接觸綁定，綁定的事件失效
要注意，iQuery中的 .事件 如(.click())其實就是單個的綁定事件的簡寫(bind("click"))
html：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>02_事件綁定.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script language="JavaScript" src="../js/jquery-1.4.2.js"></script> <link rel="stylesheet" type="text/css" href="./css/style.css" rel="external nofollow" /> </head> <body> <div id="panel"> <input type="button" id="start" value="綁定事件"> <input type="button" id="stop" value="解綁事件"> <h5 class="head">什么是jQuery?</h5> <div class="content"> jQuery是繼Prototype之后又一個優秀的JavaScript庫，它是一個由 John Resig 創建于2006年1月的開源項目。jQuery憑借簡潔的語法和跨平臺的兼容性，極大地簡化了JavaScript開發人員遍歷HTML文檔、操作DOM、處理事件、執行動畫和開發Ajax。它獨特而又優雅的代碼風格改變了JavaScript程序員的設計思路和編寫程序的方式。 </div> </div> </body> <script language="JavaScript"> //當鼠標單次點擊h5標題時,顯示答案;當鼠標雙次點擊h5標題時,隱藏答案// $("h5").click(function(){// if($("div[class=content]").is(":hidden")){// $("div[class=content]").show();// }else{// $("div[class=content]").hide();// }// }) // //動態效果// $("#start").click(function(){// /*// * 動態綁定點擊事件:綁定單個事件// * bind(type,data,fn)// * * type:指定要綁定的事件名稱// * * data:(可選)作為event.data屬性值傳遞給事件對象的額外數據對象// * * fn:回調函數,function(){}// */// $("h5").bind("click",function(){// if($("div[class=content]").is(":hidden")){// $("div[class=content]").show();// }else{// $("div[class=content]").hide();// }// });// // });// $("#stop").click(function(){// /*// * 動態解綁定點擊事件// * unbind(type,fn)// * * type:(可選)指定要解綁的事件名稱// * * fn:(可選)回調函數// */// $("h5").unbind();// }); // $("h5").mouseover(function(){// $("div[class=content]").show();// }).mouseout(function(){// $("div[class=content]").hide();// }); //動態效果 $("#start").click(function(){ /* * 綁定事件:綁定多個事件 * * 事件名稱之間,用空格隔開 */ $("h5").bind("mouseover mouseout",function(){ if($("div[class=content]").is(":hidden")){ $("div[class=content]").show(); }else{ $("div[class=content]").hide(); } }); }); $("#stop").click(function(){ /* * unbind(type) * * 默認為空時:解綁定所有事件 * * 指定單個事件:解綁指定的單個事件 * * 指定多個事件:解綁指定的多個事件 */ $("h5").unbind("mouseover mouseout"); }); </script></html>以上這篇淺談jQuery的bind和unbind事件(綁定和解綁事件)就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。
新聞熱點
疑難解答
