基礎事件方法:1、click(),設定滑鼠點選事件;2、dblclick(),設定滑鼠雙擊事件;3、change(),設定內容改變事件;4、focus(),設定觸發焦點事件;5、blur(),設定失去焦點事件;6、mousedown()等。
本教學操作環境:windows7系統、jquery1.10.2版本、Dell G3電腦。
事件方法觸發器或新增一個函數到被選元素的事件處理程序。
下面的表格列出了一些用於處理事件的 jQuery 方法。
方法 | 描述 | ||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
#bind() | 向元素新增事件處理程序 | ||||||||||||||||||
blur() | 新增/觸發失去焦點事件 | ||||||||||||||||||
觸發change 事件 | |||||||||||||||||||
新增/觸發click 事件 | |||||||||||||||||||
#新增/觸發double click 事件 | |||||||||||||||||||
在版本1.9 中移除。 | 移除所有透過live() 方法新增的事件處理程序 | ||||||||||||||||||
新增/觸發focus 事件 | |||||||||||||||||||
加入事件處理程序到focusin 事件 | |||||||||||||||||||
hover() | |||||||||||||||||||
##keydown() | |||||||||||||||||||
keypress() | |||||||||||||||||||
keyup() | |||||||||||||||||||
live() | |||||||||||||||||||
新增一個或多個事件處理程序到目前或未來的被選元素 | mousedown() | ||||||||||||||||||
mouseenter() | |||||||||||||||||||
mouseleave() | |||||||||||||||||||
mousemove() | |||||||||||||||||||
mouseout() | |||||||||||||||||||
mouseover() | |||||||||||||||||||
mouseup() | |||||||||||||||||||
off() | |||||||||||||||||||
on() | |||||||||||||||||||
one() | |||||||||||||||||||
ready() | |||||||||||||||||||
toggle() | |||||||||||||||||||
新增click 事件之間要切換的兩個或多個函數 | trigger() | ||||||||||||||||||
triggerHandler() | |||||||||||||||||||
unbind() | |||||||||||||||||||
undelegate() | |||||||||||||||||||
說明:1、以上事件函數有三種用法: //直接绑定事件到元素上 $('.target1').keydown(function(e) { $("em:first").text(e.target.value) //通过对象e获取输入的值 }); //传递参数调用函数处理 $("#test").click(11111,function(e) { //this指向 div元素 //e.data => 11111 通过e传递参数数据 }); //手动触发已绑定的点击事件 $elem.click() 登入後複製 2、mouseover與mouseenter區別:不論滑鼠指標穿過被選元素或其子元素,都會觸發mouseover 事件,稱作支援冒泡處理,冒泡處理指子元素與父元素共同定義的事件,在觸發子元素時,或沒有定義子元素,事件就會向父級傳播,引發父級事件觸發。只有在滑鼠指標穿過被選元素時,才會觸發 mouseenter 事件。 3、form元素是有預設提交表單的行為,如果透過submit處理的話,需要禁止瀏覽器的這個預設行為。傳統的方式是呼叫事件物件 e.preventDefault() 來處理, jQuery中可以直接在函數中最後結尾return false即可。 //回车键或者点击提交表单后禁止浏览器默认跳转: $('#target2').submit(function() { alert('捕获提交表达动作,阻止页面跳转') return false; }); 登入後複製 4、on()使用 基本用法:.on( events ,[ selector ] ,[ data ] ) 最常見的給元素綁定一個點擊事件,比較一下捷徑與on方式的不同 $("#elem").click(function(){}) //快捷方式 $("#elem").on('click',function(){}) //on方式 //多个事件绑定同一个函数,通过空格分离,传递不同的事件名,可以同时绑定多个事件 $("#elem").on("mouseover mouseout",function(){ }); //多个事件绑定不同函数 $("#elem").on({ mouseover:function(){}, mouseout:function(){} }); //将数据传递到处理程序 $( "button" ).on( "click", { //第二个参数传递数据给函数调用 name: "Mr.Tory" }, greet ); function greet( event ) { alert( "Hello " + event.data.name ); //输出Hello Mr.Tory } 登入後複製 #事件物件的屬性與方法
、web前端影片】 以上是jquery有哪些基礎事件方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
使用 Javascript / Jquery 提交表單且不含按鈕
我試圖透過呼叫JavaScript函數並使用JQUERY/PHP執行表單來提交沒有按鈕的表單。我希望表單在後端靜默執行,而無需重新載入頁面。不幸的是,它不斷傳回JavaScript...
來自於 2024-04-06 14:54:03
0
2
421
如何使用 jquery 檢索 HTML 資料表中未選定行的值
我試圖獲取所有未單擊按鈕的行的值。例如,當我單擊第一行上的按鈕時,我想檢索沒有單擊的行的值。 vartable=document.getElementById("all_...
來自於 2024-04-05 09:26:49
0
1
1418
需要一個 jquery 腳本,根據最終用戶的當前選擇從選擇框中移動選定的選項
我有一個HTML頁面,最終用戶可以透過選擇框元素對我們的項目進行排名。請參閱小提琴來觀看簡單的演示:https://jsfiddle.net/Balkanlii/ghecv1j8/...
來自於 2024-04-04 18:40:04
0
1
3528
我已經透過書籤在純 CSS 中創建了一個元素。它已創建,但不可見
我的程式碼如下:g=document.createElement('div');g.setAttribute("id","divcontainer&q...
來自於 2024-04-04 17:27:27
0
1
417
在 Safari/Firefox iOS 上無法傳送表單數據
這適用於除iOS上的Safari/Firefox之外的所有平台:jQuery("#gform_1").one('submit',function(event){...
來自於 2024-04-04 12:53:48
0
1
303
相關專題
更多>
熱門教學
更多>
|