建站
咨詢
售后
建站咨詢
新聞中心
jquery 是為事件處理特別設計的。
專注于為中小企業(yè)提供做網站、成都網站設計服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業(yè)永川免費做網站提供優(yōu)質的服務。我們立足成都，凝聚了一批互聯(lián)網行業(yè)人才，有力地推動了數千家企業(yè)的穩(wěn)健成長，幫助中小企業(yè)通過網站建設實現(xiàn)規(guī)模擴充和轉變。
什么是事件？
頁面對不同訪問者的響應叫做事件。
事件處理程序指的是當 HTML 中發(fā)生某些事件時所調用的方法。
實例：
- 在元素上移動鼠標。
- 選取單選按鈕
- 點擊元素
在事件中經常使用術語"觸發(fā)"（或"激發(fā)"）例如： "當您按下按鍵時觸發(fā) keypress 事件"。
常見 DOM 事件：
| 鼠標事件 | 鍵盤事件 | 表單事件 | 文檔/窗口事件 |
|---|---|---|---|
| click | keypress | submit | load |
| dblclick | keydown | change | resize |
| mouseenter | keyup | focus | scroll |
| mouseleave | blur | unload | |
| hover |
jQuery 事件方法語法
在 jQuery 中，大多數 DOM 事件都有一個等效的 jQuery 方法。
頁面中指定一個點擊事件：
$("p").click();
下一步是定義什么時間觸發(fā)事件。您可以通過一個事件函數實現(xiàn)：
$("p").click(function(){
// action goes here!!
});
常用的 jQuery 事件方法
$(document).ready()
$(document).ready() 方法允許我們在文檔完全加載完后執(zhí)行函數。該事件方法在 jQuery 語法 章節(jié)中已經提到過。
click()
click() 方法是當按鈕點擊事件被觸發(fā)時會調用一個函數。
該函數在用戶點擊 HTML 元素時執(zhí)行。
在下面的實例中，當點擊事件在某個
元素上觸發(fā)時，隱藏當前的
元素：
實例
$("p").click(function(){
$(this).hide();
});
嘗試一下 ?
dblclick()
當雙擊元素時，會發(fā)生 dblclick 事件。
dblclick() 方法觸發(fā) dblclick 事件，或規(guī)定當發(fā)生 dblclick 事件時運行的函數：
實例
$("p").dblclick(function(){
$(this).hide();
});
嘗試一下 ?
mouseenter()
當鼠標指針穿過元素時，會發(fā)生 mouseenter 事件。
mouseenter() 方法觸發(fā) mouseenter 事件，或規(guī)定當發(fā)生 mouseenter 事件時運行的函數：
實例
$("#p1").mouseenter(function(){
alert("You entered p1!");
});
嘗試一下 ?
mouseleave()
當鼠標指針離開元素時，會發(fā)生 mouseleave 事件。
mouseleave() 方法觸發(fā) mouseleave 事件，或規(guī)定當發(fā)生 mouseleave 事件時運行的函數：
實例
$("#p1").mouseleave(function(){
alert("Bye! You now leave p1!");
});
嘗試一下 ?
mousedown()
當鼠標指針移動到元素上方，并按下鼠標按鍵時，會發(fā)生 mousedown 事件。
mousedown() 方法觸發(fā) mousedown 事件，或規(guī)定當發(fā)生 mousedown 事件時運行的函數：
實例
$("#p1").mousedown(function(){
alert("Mouse down over p1!");
});
嘗試一下 ?
mouseup()
當在元素上松開鼠標按鈕時，會發(fā)生 mouseup 事件。
mouseup() 方法觸發(fā) mouseup 事件，或規(guī)定當發(fā)生 mouseup 事件時運行的函數：
實例
$("#p1").mouseup(function(){
alert("Mouse up over p1!");
});
嘗試一下 ?
hover()
hover()方法用于模擬光標懸停事件。
當鼠標移動到元素上時，會觸發(fā)指定的第一個函數(mouseenter);當鼠標移出這個元素時，會觸發(fā)指定的第二個函數(mouseleave)。
實例
$("#p1").hover(function(){
alert("You entered p1!");
},
function(){
alert("Bye! You now leave p1!");
});
嘗試一下 ?
focus()
當元素獲得焦點時，發(fā)生 focus 事件。
當通過鼠標點擊選中元素或通過 tab 鍵定位到元素時，該元素就會獲得焦點。
focus() 方法觸發(fā) focus 事件，或規(guī)定當發(fā)生 focus 事件時運行的函數：
實例
$("input").focus(function(){
$(this).css("background-color","#cccccc");
});
嘗試一下 ?
blur()
當元素失去焦點時，發(fā)生 blur 事件。
blur() 方法觸發(fā) blur 事件，或規(guī)定當發(fā)生 blur 事件時運行的函數：
實例
$("input").blur(function(){
$(this).css("background-color","#ffffff");
});
嘗試一下 ?
比較keypress、keydown與keyup
- keydown：在鍵盤上按下某鍵時發(fā)生，一直按著則會不斷觸發(fā)（opera瀏覽器除外），它返回的是鍵盤代碼;
- keypress：在鍵盤上按下一個按鍵，并產生一個字符時發(fā)生, 返回ASCII碼。注意: shift、alt、ctrl等鍵按下并不會產生字符，所以監(jiān)聽無效，換句話說，只有按下能在屏幕上輸出字符的按鍵時keypress事件才會觸發(fā)。若一直按著某按鍵則會不斷觸發(fā)。
- keyup：用戶松開某一個按鍵時觸發(fā)，與keydown相對，返回鍵盤代碼.
本文標題：創(chuàng)新互聯(lián)jQuery教程：jQuery事件
新聞來源：http://www.5511xx.com/article/djgspij.html
