JQuery 常用方法和事件詳細(xì)介紹
文檔就緒函數(shù)
$(document).ready(function(){
--- jQuery functions go here ----
});
這是為了防止文檔在完全加載(就緒)之前運(yùn)行 jQuery 代碼。
如果在文檔沒有完全加載之前就運(yùn)行函數(shù),操作可能失敗。(試圖隱藏一個(gè)不存在的元素;獲得未完全加載的圖像的大小)
把所有 jQuery 代碼置于事件處理函數(shù)中
把所有事件處理函數(shù)置于文檔就緒事件處理器中
hide/show/toogle
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
$(selector).toggle(speed,callback);
可選的 speed 參數(shù)規(guī)定隱藏/顯示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可選的 callback 參數(shù)是隱藏或顯示或切換完成后所執(zhí)行的函數(shù)名稱。
jQuery 事件
Event 函數(shù) | 綁定函數(shù)至 |
---|---|
$(document).ready(function) | 將函數(shù)綁定到文檔的就緒事件(當(dāng)文檔完成加載時(shí)) |
$(selector).click(function) | 觸發(fā)或?qū)⒑瘮?shù)綁定到被選元素的點(diǎn)擊事件 |
$(selector).dblclick(function) | 觸發(fā)或?qū)⒑瘮?shù)綁定到被選元素的雙擊事件 |
$(selector).focus(function) | 觸發(fā)或?qū)⒑瘮?shù)綁定到被選元素的獲得焦點(diǎn)事件 |
$(selector).mouseover(function) | 觸發(fā)或?qū)⒑瘮?shù)綁定到被選元素的鼠標(biāo)懸停事件 |
jQuery Fading 方法:
通過 jQuery,您可以實(shí)現(xiàn)元素的淡入淡出效果。
jQuery 擁有下面四種 fade 方法:
- fadeIn()
- fadeOut()
- fadeToggle()
可選的 speed 參數(shù)規(guī)定效果的時(shí)長。它可以取以下值:"slow"、"fast" 或毫秒。可選的 callback 參數(shù)是 fading 完成后所執(zhí)行的函數(shù)名稱。
- fadeTo()
jQuery fadeTo() 方法允許漸變?yōu)榻o定的不透明度(值介于 0 與 1 之間)。
$(selector).fadeTo(speed,opacity,callback);
必需的 speed 參數(shù)規(guī)定效果的時(shí)長。它可以取以下值:"slow"、"fast" 或毫秒。
必需的 opacity 參數(shù)將淡入淡出效果設(shè)置為給定的不透明度(值介于 0 與 1 之間)。
可選的 callback 參數(shù)是該函數(shù)完成后所執(zhí)行的函數(shù)名稱。
由于 JavaScript 語句(指令)是逐一執(zhí)行的,按照次序,動畫之后的語句可能會產(chǎn)生錯(cuò)誤或頁面沖突,因?yàn)閯赢嬤€沒有完成。
為了避免這個(gè)情況,您可以以參數(shù)的形式添加 Callback 函數(shù)。如果您希望在一個(gè)涉及動畫的函數(shù)之后來執(zhí)行語句,請使用 callback 函數(shù)。
相關(guān)文章
jquery實(shí)現(xiàn)百葉窗效果(利用li的定位)
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)百葉窗效果,利用li的定位,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10利用jQuery的動畫函數(shù)animate實(shí)現(xiàn)豌豆發(fā)射效果
本文主要講解jQuery的animate函數(shù)的基本用法,利用動畫函數(shù)animate實(shí)現(xiàn)豌豆發(fā)射的效果,對于學(xué)習(xí)animate很有幫助,有需要的可以參考借鑒。2016-08-08jQuery實(shí)現(xiàn)數(shù)字華容道小游戲(實(shí)例代碼)
這篇文章主要介紹了jQuery實(shí)現(xiàn)數(shù)字華容道小游戲功能,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-01-01jQuery validate 中文API 附validate.js中文api手冊
jQuery validate 中文API 附validate.js中文api手冊2010-07-07jQuery ajax serialize() 方法使用示例
serialize() 方法創(chuàng)建以標(biāo)準(zhǔn) URL 編碼表示的文本字符串,下面為大家介紹下jQuery serialize方法的使用2014-11-11jQuery+Ajax請求本地?cái)?shù)據(jù)加載商品列表頁并跳轉(zhuǎn)詳情頁的實(shí)現(xiàn)方法
本文通過實(shí)例代碼給大家介紹了jQuery+Ajax請求本地?cái)?shù)據(jù)加載商品列表頁并跳轉(zhuǎn)詳情頁,需要的朋友可以參考下2017-07-07修改好的jquery滾動字幕效果實(shí)現(xiàn)代碼
修改好的jquery滾動字幕效果,需要的朋友可以參考下。2011-06-06