JQuery 常用方法和事件詳細(xì)介紹
文檔就緒函數(shù)
$(document).ready(function(){
--- jQuery functions go here ----
});
這是為了防止文檔在完全加載(就緒)之前運(yùn)行 jQuery 代碼。
如果在文檔沒(méi)有完全加載之前就運(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 方法:
通過(guò) jQuery,您可以實(shí)現(xiàn)元素的淡入淡出效果。
jQuery 擁有下面四種 fade 方法:
- fadeIn()
- fadeOut()
- fadeToggle()
可選的 speed 參數(shù)規(guī)定效果的時(shí)長(zhǎng)。它可以取以下值:"slow"、"fast" 或毫秒。可選的 callback 參數(shù)是 fading 完成后所執(zhí)行的函數(shù)名稱。
- fadeTo()
jQuery fadeTo() 方法允許漸變?yōu)榻o定的不透明度(值介于 0 與 1 之間)。
$(selector).fadeTo(speed,opacity,callback);
必需的 speed 參數(shù)規(guī)定效果的時(shí)長(zhǎng)。它可以取以下值:"slow"、"fast" 或毫秒。
必需的 opacity 參數(shù)將淡入淡出效果設(shè)置為給定的不透明度(值介于 0 與 1 之間)。
可選的 callback 參數(shù)是該函數(shù)完成后所執(zhí)行的函數(shù)名稱。
由于 JavaScript 語(yǔ)句(指令)是逐一執(zhí)行的,按照次序,動(dòng)畫之后的語(yǔ)句可能會(huì)產(chǎn)生錯(cuò)誤或頁(yè)面沖突,因?yàn)閯?dòng)畫還沒(méi)有完成。
為了避免這個(gè)情況,您可以以參數(shù)的形式添加 Callback 函數(shù)。如果您希望在一個(gè)涉及動(dòng)畫的函數(shù)之后來(lái)執(zhí)行語(yǔ)句,請(qǐng)使用 callback 函數(shù)。
- jquery中的常用事件bind、hover、toggle等示例介紹
- jQuery中的常用事件總結(jié)
- jQuery隨手筆記之常用的jQuery操作DOM事件
- 分享一些常用的jQuery動(dòng)畫事件和動(dòng)畫函數(shù)
- jQuery移除或禁用html元素點(diǎn)擊事件常用方法小結(jié)
- jQuery事件對(duì)象的屬性和方法詳解
- jquery 事件對(duì)象屬性小結(jié)
- jquery中event對(duì)象屬性與方法小結(jié)
- Jquery中Event對(duì)象屬性小結(jié)
- 基于jQuery選擇器之表單對(duì)象屬性篩選選擇器的實(shí)例
- JQuery中的常用事件、對(duì)象屬性與使用方法分析
相關(guān)文章
jQuery實(shí)現(xiàn)飛機(jī)大戰(zhàn)游戲
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)飛機(jī)大戰(zhàn)游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-05-05
jQuery實(shí)現(xiàn)仿騰訊迷你首頁(yè)選項(xiàng)卡效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)仿騰訊迷你首頁(yè)選項(xiàng)卡效果代碼,可實(shí)現(xiàn)tab切換按鈕的左右滑動(dòng)顯示及點(diǎn)擊切換效果,涉及jQuery基于鼠標(biāo)事件實(shí)現(xiàn)頁(yè)面元素動(dòng)態(tài)操作技巧,需要的朋友可以參考下2015-09-09
jQuery實(shí)現(xiàn)拖動(dòng)調(diào)整表格單元格大小的代碼實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)拖動(dòng)調(diào)整表格單元格大小的代碼實(shí)例,本文直接給出實(shí)現(xiàn)代碼,需要的朋友可以參考下2015-01-01
JQuery仿小米手機(jī)搶購(gòu)頁(yè)面倒計(jì)時(shí)效果
這篇文章主要介紹了JQuery仿小米手機(jī)搶購(gòu)頁(yè)面倒計(jì)時(shí)效果,從功能到實(shí)現(xiàn)原理以及主要代碼都做了詳細(xì)的介紹,推薦給有相同需求的小伙伴。2014-12-12
jQuery 常見(jiàn)學(xué)習(xí)網(wǎng)站與參考書
打算學(xué)習(xí)jquery的朋友可以參下如下網(wǎng)上,參考書嗎,可以看下 鋒利的jquery腳本之家提供電子版下載。2009-11-11

