Event事件詳解

2022-05-18 17:03:52 字數 1174 閱讀 6189

首先提到event,先要明白event的產生,也要先明白焦點,什麼是焦點。焦點 : 使瀏覽器能夠區分使用者輸入的物件,當乙個元素有焦點的時候,那麼他就可以接收使用者的輸入。

我們可以通過一些方式給元素設定焦點。而並不是所有元素都能夠接收焦點的,能夠響應使用者操作的元素才有焦點。例如:

"

text

" /> "

說到input,平時用的較多的是onfocus : 當元素獲取到焦點的時候觸發,onblur : 當元素失去焦點的時候觸發。當然還有是不常用:obj.select() -選擇指定元素裡面的文字內容。

//

點選btn時,選中text中的內容

obtn.onclick =function()

接下來才是event : 事件物件 , 當乙個事件發生的時候,和當前這個物件發生的這個事件有關的一些詳細的資訊都會被臨時儲存到乙個指定地方-event物件,供我們在需要的呼叫。而剛剛說的,event會儲存相關資訊,比如說用來滑鼠位置、鍵盤按鍵。event物件的相容:ev = ev || window.event。而接踵而來的就有clientx[y] ,它是--當乙個事件發生的時候,滑鼠到頁面可視區的距離。我們可以通過一段**檢視event物件中的屬性。

function fn1(ev) 

}document.onclick = fn1;

event物件的所有相關屬性,都會列印在控制台上。

而由event延伸出來的乙個小demo,就是可以隨滑鼠任意移動的div。

詳見:隨滑鼠任意移動的div

**如下:

"height: 2000px;

">

"div1

">

提到事件,一定會想到事件冒泡 : 當乙個元素接收到事件的時候,會把他接收到的所有傳播給他的父級,一直到頂層window.事件冒泡機制。而阻止冒泡 : 當前要阻止冒泡的事件函式中呼叫 event.cancelbubble = true; 比較簡單乙個就是模擬的下拉列表。

"button

" value="

按鈕" id="

btn" />

"div1

">

Spring的Event事件處理使用詳解

spring中使用事件非常簡單,只需要以下的幾個步驟 public class userregisterevent extends public string getusername 定義傳送郵件和發放優惠券的監聽 component order 2 可以使用order指定順序,越小優先順序越高 p...

事件物件event

1.e.client 相對於當前頁面 視窗,不是這個元素 可視區域的左頂點 document.onmousemove function e 2.e.screen 相對於計算機螢幕的左頂點 document.body.onclick function e 3.offset 事件觸發時滑鼠距離該元素左邊...

事件物件(event)

再觸發dom上的某個事件時,會產生乙個事件物件event,這個物件中包含著所有與事件有關的資訊。所有瀏覽器都支援event物件,但支援的方式不同。1.事件物件的獲取 event的獲取 event內容重要內容 2.screenx pagex和clientx的區別 3.pagey和pagex的相容寫法 ...