欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery事件與動(dòng)畫基礎(chǔ)詳解

 更新時(shí)間：2017年02月23日 09:00:05   作者：瞿亮  
本文主要介紹了jQuery事件與動(dòng)畫的基礎(chǔ)知識(shí)，具有很好的參考價(jià)值，下面跟著小編一起來看下吧

今天我們就談?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)指針移過時(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         用來綁定處理函數(shù)

unbind（[type],[fn]）    (移除)

type    主要包括blur，focus,click,mouseout等基礎(chǔ)事件，此外，還可以自定義事件

fn        用來解除綁定的處理函數(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ī)定元素從隱藏（顯示）到可見（不可見）的速度

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í)或者工作能帶來一定的幫助，同時(shí)也希望多多支持腳本之家！

相關(guān)文章

最新評(píng)論