今天我們就談?wù)刯query中的事件和簡(jiǎn)單動(dòng)畫吧，它們畢竟基礎(chǔ)是進(jìn)階華麗的根本！！
1.事件
1.window事件
ready 準(zhǔn)備就緒
2.鼠標(biāo)事件
方法 執(zhí)行時(shí)機(jī)
click(fn) 單擊鼠標(biāo)
$(document).ready(function(){ $("dd>img").click(function(){ $("dt>img").show(); });mouseover(fn) 鼠標(biāo)指針移過(guò)時(shí)
mouseout(fn) 鼠標(biāo)指針移出時(shí)
$("#nav .navsBox ul li").mouseover(function(){ $(this).addClass("onbg"); //為該元素添加類樣式.onbg }).mouseout(function(){ $(this).removeClass("onbg");//為該元素移除類樣式.onbg });hover()
$(".top").hover(function(){ $(this).addClass('bgreen'); },function(){ $(this).removeClass('bgreen'); }); 3.鍵盤事件
keydown() 按下鍵盤時(shí)
keyup() 釋放按鍵時(shí)
keypress() 產(chǎn)生可打印的字符時(shí)
$(function(){ $("[type=password]").keyup(function(){ $("#e").append("keyup"); }).keydown(function(){ $("#e").append("keydown"); }).keypress(function(){ $("#e").append("keypress"); }); $(document).keydown(function(event){ if(event.keyCode=="13"){ alert("確認(rèn)要提交么？？？"); } });});4.表單事件
focus() 獲得焦點(diǎn)
blur() 失去焦點(diǎn)
$(function(){ $("input").focus(function(){ $(this).next().css("color","red"); //alert("1123"); }); $("input").blur(function(){ $(this).next().css("color",""); }); });綁定事件與移除事件
bind（type,[data],fn） （綁定）
type 主要包括blur，focus，click，mouseout等基礎(chǔ)事件，此外，還可以是自定義事件
[data] 作為event.data屬性值傳遞給事件對(duì)象的額外數(shù)據(jù)對(duì)象，該參數(shù)不是必需的
fn 用來(lái)綁定處理函數(shù)
unbind（[type],[fn]） (移除)
type 主要包括blur，focus,click,mouseout等基礎(chǔ)事件，此外，還可以自定義事件
fn 用來(lái)解除綁定的處理函數(shù)
$(function(){ $("li").bind({ mouseover:function(){ $(this).css("background-color","green"); },mouseout:function(){ $(this).css("background-color",""); } }); $("li").unbind();}); 2.動(dòng)畫
1.控制元素顯示與隱藏 $(selector).show([speed],[callback])
$(selector).hide([speed],[callback])
speed：可選。規(guī)定元素從隱藏（顯示）到可見(jiàn)（不可見(jiàn)）的速度
callback ：可選。show函數(shù)執(zhí)行完了之后，要執(zhí)行的函數(shù)
$(function(){ $("p:visible").hide(100); }); //$("p:hidden").show(100);2.改變?cè)氐耐该鞫?/strong>
$(function(){ $("input").click(function(){ $("img").fadeOut(100); //淺出 //$("img").fadeIn(100); 淡入 }); })3.改變?cè)氐母叨?/strong>
$(function(){ $("h2").click(function(){ // $(".txt").slideup(); $(".txt").slideDown(); });});以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持武林網(wǎng)！
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
