09 事件对象
上篇介紹完我們js的事件流的概念之后,相信大家對事件流也有所了解了。那么接下來我們看一下jquery的事件操作。
?
在說jquery的每個事件之前,我們先來看一下事件對象
事件對象
Event 對象代表事件的狀態(tài),比如事件在其中發(fā)生的元素、鍵盤按鍵的狀態(tài)、鼠標的位置、鼠標按鈕的狀態(tài)。
? ? ? ? ?例如: 當(dāng)用戶單擊某個元素的時候,我們給這個元素注冊的事件就會觸發(fā),該事件的本質(zhì)就是一個函數(shù),而該函數(shù)的形參接收一個event對象
? ? ? ?2.事件通常與函數(shù)結(jié)合使用,函數(shù)不會在事件發(fā)生前被執(zhí)行!
?
事件流的由來(了解)
由于微軟和網(wǎng)景亂搞,后來必須要為事件傳播機制,制定一個標準,因為事件捕獲是網(wǎng)景公司開發(fā)出來的,而事件冒泡是由微軟公司開發(fā)出來的,它們都想要自己的技術(shù)成為標準,所以導(dǎo)致這兩個公司老是干架,制定標準的人為了不讓它們干架,所以研發(fā)了事件流.
?
關(guān)于event對象
- 在觸發(fā)的事件的函數(shù)里面我們會接收到一個event對象,通過該對象我們需要的一些參數(shù),比如說我們需要知道此事件作用到誰身上了,就可以通過event的屬性target來獲取到(IE暫且不談),或者想阻止瀏覽器的默認行為可以通過方法preventDefault()來進行阻止.以下是event對象的一些屬性和方法
| altKey | 返回當(dāng)事件被觸發(fā)時,”ALT” 是否被按下。 |
| button | 返回當(dāng)事件被觸發(fā)時,哪個鼠標按鈕被點擊。 |
| clientX | 返回當(dāng)事件被觸發(fā)時,鼠標指針的水平坐標。 |
| clientY | 返回當(dāng)事件被觸發(fā)時,鼠標指針的垂直坐標。 |
| ctrlKey | 返回當(dāng)事件被觸發(fā)時,”CTRL” 鍵是否被按下。 |
| metaKey | 返回當(dāng)事件被觸發(fā)時,”meta” 鍵是否被按下。 |
| relatedTarget | 返回與事件的目標節(jié)點相關(guān)的節(jié)點。 |
| screenX | 返回當(dāng)某個事件被觸發(fā)時,鼠標指針的水平坐標。 |
| screenY | 返回當(dāng)某個事件被觸發(fā)時,鼠標指針的垂直坐標。 |
| shiftKey | 返回當(dāng)事件被觸發(fā)時,”SHIFT” 鍵是否被按下 |
- IE?屬性(除了上面的鼠標/事件屬性,IE 瀏覽器還支持下面的屬性)
| cancelBubble | 如果事件句柄想阻止事件傳播到包容對象,必須把該屬性設(shè)為 true。 |
| fromElement | 對于 mouseover 和 mouseout 事件,fromElement 引用移出鼠標的元素。 |
| keyCode | 對于 keypress 事件,該屬性聲明了被敲擊的鍵生成的 Unicode 字符碼。對于 keydown 和 keyup |
| offsetX,offsetY | 發(fā)生事件的地點在事件源元素的坐標系統(tǒng)中的 x 坐標和 y 坐標。 |
| returnValue | 如果設(shè)置了該屬性,它的值比事件句柄的返回值優(yōu)先級高。把這個屬性設(shè)置為 |
| srcElement | 對于生成事件的 Window 對象、Document 對象或 Element 對象的引用。 |
| toElement | 對于 mouseover 和 mouseout 事件,該屬性引用移入鼠標的元素。 |
| x,y | 事件發(fā)生的位置的 x 坐標和 y 坐標,它們相對于用CSS動態(tài)定位的最內(nèi)層包容元素。 |
?
?
- 標準 Event 屬性 下面列出了 2 級 DOM 事件標準定義的屬性。
| bubbles | 返回布爾值,指示事件是否是起泡事件類型。 |
| cancelable | 返回布爾值,指示事件是否可擁可取消的默認動作。 |
| currentTarget | 返回其事件監(jiān)聽器觸發(fā)該事件的元素。 |
| eventPhase | 返回事件傳播的當(dāng)前階段。 |
| target | 返回觸發(fā)此事件的元素(事件的目標節(jié)點)。 |
| timeStamp | 返回事件生成的日期和時間。 |
| type | 返回當(dāng)前 Event 對象表示的事件的名稱。 |
| initEvent() | 初始化新創(chuàng)建的 Event 對象的屬性。 |
| preventDefault() | 通知瀏覽器不要執(zhí)行與事件關(guān)聯(lián)的默認動作。 |
| stopPropagation() | 不再派發(fā)事件。 |
Event對象的一些兼容性寫法(了解)
- 獲得event對象兼容性寫法?
event || (event = window.event); - 獲得target兼容型寫法?
event.target||event.srcElement - 阻止瀏覽器默認行為兼容性寫法?
event.preventDefault ? event.preventDefault() : (event.returnValue = false); - 阻止冒泡寫法?
event.stopPropagation ? event.stopPropagation() : (event.cancelBubble = true);
- 獲得event對象兼容性寫法?
轉(zhuǎn)載于:https://www.cnblogs.com/mayugang/p/10338705.html
總結(jié)
- 上一篇: 快速安装puppeteer (跳过安装C
- 下一篇: [折半搜索][has] Jzoj P42