<2>jQuery浜嬩欢鍜宩Query涓殑Ajax
鎺ョ潃涓婇潰涓€绡囩户缁€傚叾瀹瀓query鐨勫唴瀹硅窡瀹㈡埛绔痡avascript鍐呭鍩烘湰鏄竴涓€瀵瑰簲鐨勩€?

涓夈€乯query 浜嬩欢
褰撶敤鎴锋祻瑙堥〉闈㈡椂锛屾祻瑙堝櫒浼氬椤甸潰浠ｇ爜杩涜瑙ｉ噴鎴栫紪璇戙€傝繖涓繃绋嬪疄璐ㄦ槸浜嬩欢椹卞姩鐨勶紝鍗抽〉闈㈠湪鍔犺浇鏃舵墽琛屼竴涓猯oad浜嬩欢锛屽湪杩欎釜浜嬩欢涓疄鐜版祻瑙堝櫒缂栬瘧椤甸潰浠ｇ爜鐨勮繃绋嬨€?

1. jquery浜嬩欢瀵硅薄
闇€瑕佺煡閬撶殑鏈€閲嶈鐨勪竴浠朵簨鎯呮槸锛?strong>姣忎釜浜嬩欢澶勭悊绋嬪簭閮戒紶鍏ヤ竴涓猨query浜嬩欢瀵硅薄浣滀负绗竴涓弬鏁?/span>锛岃瀵硅薄鐨勫瓧娈垫彁渚涗簡涓庤浜嬩欢鐩稿叧鐨勮缁嗕俊鎭紙濡傞紶鏍囨寚閽堢殑鍧愭爣锛夈€傞€氬父锛岃皟鐢ㄤ簨浠跺鐞嗙▼搴忔椂鍙甫鏈変簨浠跺璞¤繖涓敮涓€鍙傛暟锛屽鏋滅敤trigger()鏄惧紡瑙﹀彂浜嬩欢锛屽彲浠ヤ紶鍏ラ澶栫殑鍙傛暟鏁扮粍锛岃繖浜涘弬鏁板湪绗竴涓璞″弬鏁颁箣鍚庝紶閫掔粰浜嬩欢澶勭悊绋嬪簭銆?
Jquery閫氳繃瀹氫箟鑷繁鐨凟vent瀵硅薄鏉?strong>闅愯棌娴忚鍣ㄤ箣闂寸殑瀹炵幇宸紓銆侸query浜嬩欢瀵硅薄鍙浠3c鏍囧噯涓烘爣鍑嗭紝鍚屾椂涔熷疄鐜颁簡涓€浜涘疄闄呯殑浜嬩欢鏍囧噯銆侸query浼氬皢涓€涓嬫墍鏈夊瓧娈典粠鍘熺敓Event瀵硅薄涓鍒跺埌jquery瀵硅薄涓婏紙灏界瀵逛簬鐗瑰畾浜嬩欢绫诲瀷鏉ヨ鏈変簺瀛楁鍊间负undefined锛夛細



1. 浜嬩欢鏈哄埗
涓ユ牸鏉ヨ锛屼簨浠跺湪瑙﹀彂鍚庤鍒嗕负涓や釜闃舵锛堝墠闈㈠鎴风javascript閮ㄥ垎璇村埌鏄笁涓樁娈碉紝涓€鎹曡幏锛屼簩鍝嶅簲锛屼笁鍐掓场锛夈€備竴鏄崟鑾凤紝鍙︿竴涓垯鏄啋娉★紙bubbling锛夈€備絾閬楁喚鐨勬槸澶у鏁版祻瑙堝櫒骞朵笉鏄兘鏀寔鎹曡幏闃舵锛?strong>jquery涔熶笉鏀寔銆傚洜姝ゅ湪浜嬩欢瑙﹀彂鍚庡線寰€鎵ц鍐掓场杩囩▼銆傛墍璋撶殑鍐掓场鍏跺疄灏辨槸浜嬩欢鎵ц鐨勯『搴忋€?
浠ｇ爜涓彲浠ヤ娇鐢ㄤ簨浠剁殑stopPropagation()鏂规硶闃绘浜嬩欢鐨勫啋娉¤繃绋嬶紝杩樺彲浠ラ€氳繃璇彞return false瀹炵幇鍋滄浜嬩欢鐨勫啋娉°€?
濡傦細
$(鈥渂ody, div, #button鈥?.click(function(event){
鈥?
event.stopPropagation(); // 闃绘鍐掓场杩囩▼銆?
})

2. 椤甸潰杞藉叆浜嬩欢ready(), OnLoad()
Jquery鐨剅eady鍜宩avascript鐨刼nLoad浜嬩欢鍦?strong>鎵ц鏃堕棿涓?/strong>鏈夊尯鍒€?
1锛塷nLoad鏂规硶蹇呴』鏄〉闈腑鍏ㄩ儴鍏冪礌瀹屽叏鍔犺浇鍒版祻瑙堝櫒鍚庢墠瑙﹀彂锛屽鏋滈〉闈腑鐨勫浘鐗囪繃澶氭垨杩囧ぇ鍒欒绛塐nLoad()鏂规硶鎵ц瀹屾瘯鐢ㄦ埛鎵嶈兘杩涜鍏朵粬鎿嶄綔锛?
2锛塲query鐨剅eady鏂规硶鍙绛夐〉闈㈢殑dom妯″瀷鍔犺浇瀹屾瘯灏变細鎵ц銆侸query鑴氭湰鍔犺浇鍒伴〉闈㈡椂锛屼細璁剧疆涓€涓猧sReady鏍囪锛岀敤浜庣洃鍚〉闈㈠姞杞界殑杩涘害锛屽綋閬囧埌鎵цready()鏂规硶鏃讹紝閫氳繃鏌ョ湅isReady鏄惁琚缃紝濡傛灉鏈璁剧疆璇存槑椤甸潰骞舵湭鍔犺浇瀹屾垚锛屽湪姝ゆ儏鍐典笅锛屽皢鏈畬鎴愮殑閮ㄥ垎鐢ㄤ竴涓暟缁勭紦瀛樿捣鏉ワ紝鍏ㄩ儴鍔犺浇瀹屾垚鍚庡啀灏嗘湭瀹屾垚鐨勯儴鍒嗛€氳繃缂撳瓨涓€涓€鎵ц銆?

3. 缁戝畾浜嬩欢
1锛?(鈥渂utton鈥?.click(function(){
鈥?
});

2) 閫氳繃bind鏂规硶缁戝畾銆?/strong>
bind(type, [data], fn);鍏朵腑type鍙互鏄痗lick, mousemove绛夛紝涔熷彲浠ユ槸鑷畾涔変簨浠讹紝data鍙€夛紝鏄紶缁欏洖璋冨嚱鏁扮殑鏁版嵁锛屼綔涓篹vent.data灞炴€у€间紶閫掔粰浜嬩欢瀵硅薄锛宖n灏辨槸鍥炶皟鍑芥暟銆?
1) 濡傦細$(鈥?button鈥?.bind(鈥渃lick鈥? function(){
鈥?
});
甯﹀彲閫夊弬鏁帮細
$(鈥?button鈥?.bind(鈥渃lick鈥? {msg:message}, function(event){
    $(鈥?divTip鈥?.show().html(event.data.msg);
})



杩樺彲浠?strong>鍚屾椂缁戝畾澶氫釜浜嬩欢锛屽:
$(鈥減鈥?.bind(鈥渁 b鈥? fn); // 浜嬩欢a鍜宐涔嬮棿鐢ㄧ┖鏍奸殧寮€锛岄兘缁戝畾鍒癴n澶勭悊鏂规硶涓娿€?

2) bind杩樺彲浠ラ€氳繃鏄犲皠鐨勬柟寮忕粦瀹氬嚱鏁般€?/strong>
$(鈥?txt鈥?.bind({
focus:function(){
鈥?
},
change:function(){
鈥?
}
})

3) 杩樺彲浠ユ寚瀹氬懡鍚嶇┖闂?/strong>锛屼簨浠跺搷搴斿彧鍦ㄦ寚瀹氱殑鍛藉悕绌洪棿鍐呮湁鏁堛€傝繖鍦ㄦā鍧楀寲寮€鍙戜腑寰堥噸瑕併€?
鍦ㄧ粦瀹氫簨浠跺鐞嗗櫒鍒板懡鍚嶇┖闂存椂鍙渶瑕佸湪浜嬩欢鍚庡姞涓婄偣锛?锛夊拰鍛藉悕绌洪棿鍗冲彲锛屽锛?
       $(鈥渁鈥?.bind(鈥渕ouseover.myMod鈥? fn); //myMode涓哄懡鍚嶇┖闂?
       $(鈥渁鈥?.bind(鈥渕ouseover.myModA.myModB鈥? fn); //myModeA鍜宮yMOdeB涓哄懡鍚嶇┖闂?缁戝畾鍒颁袱涓懡鍚嶇┖闂?

$(鈥渁鈥?.unbind(鈥渕ouseover.myMod鈥?;// 瑙ｇ粦甯﹀懡鍚嶇┖闂寸殑浜嬩欢銆?

4. 鍒囨崲浜嬩欢hover(), toggle()
鍦╦query涓紝鏈変袱涓柟娉曠敤浜庝簨浠剁殑鍒囨崲锛屼竴涓槸hover()锛屽彟涓€涓槸toggle()銆?
1) hover()
hover()鏂规硶鍙互浣垮厓绱犲湪榧犳爣鎮仠鍜岄紶鏍囩Щ鍑虹殑浜嬩欢涓繘琛屽垏鎹紝瀹為檯浣跨敤涓彲浠ラ€氳繃jquery涓殑浜嬩欢mouseenter鍜宮oulseleave杩涜鏇挎崲銆?
$(鈥渁鈥?.hover(function(){}, function(){})
鍜?
$(鈥渁鈥?.mouseenter(function(){}) + $(鈥渁鈥?.mouseleave(function(){})
鏄瓑浠风殑銆?

2) toggle()
toggle()鏂规硶鍙互渚濇璋冪敤N涓寚瀹氱殑鍑芥暟锛岀洿鍒版渶鍚庝竴涓嚱鏁帮紝鐒跺悗閲嶅瀵硅繖浜涘嚱鏁拌疆鐣皟鐢ㄣ€?

5. 绉婚櫎浜嬩欢 unbind()
Unbind([type], [fn]), 鍙傛暟type鏄Щ闄ょ殑浜嬩欢绫诲瀷锛屽鈥渃heck鈥濃€漜lick鈥? fn涓洪渶瑕佺Щ闄ょ殑浜嬩欢澶勭悊鍑芥暟銆傚鏋滆鏂规硶涓嶅甫鍙傛暟鍒欑Щ闄ゆ墍鏈夌粦瀹氱殑浜嬩欢銆?

6. 瑙﹀彂浜嬩欢 trigger(), click()
褰撶敤鎴蜂娇鐢ㄩ