JQuery的一些常用事件
jquery中一些事件函式使用小結,需要的朋友可以參考下。
1.$(document).ready()
$(document).ready()是jQuery中響應JavaScript內建的onload事件並執行任務的一種典型方式。它和onload具有類似的效果。但是也有一些差異:
當一個文件完全下載到瀏覽器中時,會觸發window.onload事件。而使用$(document).ready()註冊的事件處理程式會在html下載完成並解析為Dom樹之後,程式碼就可以執行,但並不意味著所有關聯檔案都已經下載完畢。
一個頁面中一般只有一個onload事件處理程式,而且只能一次儲存對一個函式的引用;而$(document).ready()是可以有多個。
一般來說$(document).ready()都要優於使用onload事件處理程式。但是如果關聯檔案還沒有載入完成,則類似影像高度、寬度的屬性的呼叫就會有問題,因此需要在不同的時候選擇合適的方法。
2. 事件捕獲與事件冒泡
事件捕獲: 允許多個元素響應事件的一種策略。在事件捕獲的過程中,事件首先會交給最外層的元素,接著再交給更具體的元素。
事件冒泡:另外一種相反的策略叫時間冒泡,當事件發生時,會首先傳送給最具體的元素,在這個元素獲得響應機會之後,事件會向上冒泡到更一般的元素。事件冒泡有時候會產生副作用,導致始料不及的行為。
3.阻止事件冒泡的三種方法
指定預設操作
透過呼叫.preventDefault()方法可以在出發預設操作之前終止事件。
呼叫 event.stopPropagation()停止事件傳播
jQuery提供了一個.stopPropagation()方法,使用該方法可以完全阻止事件冒泡。例項程式碼如下:
使用stopPropagation()方法阻止事件冒泡
4.常用的事件繫結
jQuery透過使用.bind()方法為元素進行事件繫結,透過使用.unbind()方法為元素進行解除繫結。而且.bind()方法是可以執行多次繫結的,如果沒有繫結,在進行解除繫結的時候,這都是安全的。
很多時候某一個事件只需要觸發一次,隨後就要立即解除繫結,按照傳統的做法,我們可能會先進行事件繫結,然後在事件執行完畢後進行解除繫結。jQuery為我們提供了一種簡寫的方法.one來專門解決上述情景下的繁瑣的程式碼編寫,示例如下:
5.複合事件
在進行事件捕獲的時候,常常需要捕獲組合的使用者操作,並且以多個函式作為響應,這些事件我們稱為複合事件。
jQuery提供的.read()方法就是最常用的符合事件方法之一,除此之外,還有進行互動處理的時候用到的兩個函式:
.hover(over,out) 一個模仿懸停事件(滑鼠移動到一個物件上面及移出這個物件)的方法。這是一個自定義的方法,它為頻繁使用的任務提供了一種“保持在其中”的狀態。
.toggle(fn,fn) 每次點選時切換要呼叫的函式。
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/1834/viewspace-2815657/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 常用的jQuery事件有幾種?jQuery事件
- jQuery:一些js常用動效jQueryJS
- jQuery常用的一些知識點總結jQuery
- jQuery 事件jQuery事件
- jquery事件jQuery事件
- jQuery 事件方法jQuery事件
- jquery的一些小技巧jQuery
- jquery自定義事件的使用jQuery事件
- 36. jQuery 事件jQuery事件
- jQuery事件監聽jQuery事件
- jQuery常用apijQueryAPI
- JQuery6:事件冒泡jQuery事件
- jQuery select 觸發事件jQuery事件
- jquery獲取回車事件jQuery事件
- JQuery的一些基本知識jQuery
- vue 的常用事件Vue事件
- JQuery4:滑鼠事件和滾動事件jQuery事件
- 初步學習jQuery之事件jQuery事件
- JQuery7:事件委託jQuery事件
- 使用 jQuery 觸發 Vue 事件jQueryVue事件
- jQuery基本功能——事件jQuery事件
- jquery複習之路---事件篇jQuery事件
- jquery鍵盤常見事件---jQuery事件
- 1.21 JQuery4:滑鼠事件與滾動事件jQuery事件
- jQuery事件中on實現繫結多個事件jQuery事件
- jQuery事件物件event的屬性和方法jQuery事件物件
- JQuery常用方法一覽jQuery
- OpenCascade一些常用的APIAPI
- 一些常用的WebService.Web
- 常用的一些工具類
- JQuery基本知識彙總;JQuery常用方法;淺入瞭解JQueryjQuery
- jQuery知識總結之事件jQuery事件
- JavaScript和JQuery的滑鼠mouse事件冒泡處理JavaScriptjQuery事件
- [jQuery]常用正規表示式jQuery
- jQuery常用方法總結【三】jQuery
- 聊聊Spring事件:一些自己的QASpring事件
- 從零開始學Web之jQuery(一)jQuery的概念,頁面載入事件WebjQuery事件
- HTML一些常用的標籤HTML