關于jquery input textare 事件綁定及用法學習
2024-05-06 14:18:58
供稿:網友
(1)jquery 綁定事件
目前1.7以上,jquery的事件綁定已經用on替換了原來的bind;
區別:(個人理解)bind是一次綁定事件到每一個子節點;on是只綁定到父節點,然后冒泡到各個子節點;
用法:bind
一個事件,一個方法:$(".class input").bind('click',function(e){...;e.stopPropagation;})
兩個事件,一個方法:$(".class input").bind('click mouseover',function(e){...;e.stopPropagation;})
兩個事件,兩個方法:$(".class input").bind({ click:function(e){...;e.stopPropagation;}, mouseover:function(e){...;e.stopPropagation;} })
on,可以直接替換掉bind,就是說上述的用法都適用于on;
此外,on比bind多了兩個可選參數
on( events [, selector ] [, data ], handler(eventObject) )
selector:要綁定的元素,上面的例子可以寫成:$(".class").bind('click','input',function(e){...;e.stopPropagation;})
(需要注意的是,有一個事件不好用,就是'大便'ie下獨有的事件:onpropertychange;
可以用:$(".class input").bind('propertychange',function(e){...;e.stopPropagation;})
沒反應:$(".class").bind('propertychange','input',function(e){...;e.stopPropagation;})
)
data:傳遞給event.data的參數,$(".class").bind('click','input','123',function(e){alert(e.data/*123*/);e.stopPropagation;})
(更具體用法可查看手冊http://api.jquery.com/on/);
(2)input textare 事件
之前做一個文本框內容實時變化事件觸發時,用onkeyup + onchange;但onchang必須在文本框失焦后才會觸發,后來發現可以用
(if IE) onpropertychange + else oninput 來處理。
說明:
oninput 事件在用戶輸入、退格、刪除、剪切、粘貼及鼠標剪切與粘貼時觸發(在 IE9&IE9+ 中可能略有區別)。
(Firefox、Chrome、IE9&IE9+ 均支持)
onpropertychange 事件在用戶輸入、退格、刪除、剪切、粘貼及鼠標剪切與粘貼時觸發
(僅 IE 支持)。
(3)常用事件(//m.survivalescaperooms.com/article/25583.htm)
oncut 事件在粘貼(ctrl + v)、鼠標粘貼時觸發
onactivate 當對象設置為活動元素時觸發。
onafterupdate 當成功更新數據源對象中的關聯對象后在數據綁定對象上觸發。
onbeforeactivate 對象要被設置為當前元素前立即觸發。
onbeforecut 當選中區從文檔中刪除之前在源對象觸發。
onbeforedeactivate 在 activeElement 從當前對象變為父文檔其它對象之前立即觸發。
onbeforeeditfocus 在包含于可編輯元素內的對象進入用戶界面激活狀態前或可編輯容器變成控件選中區前觸發。
onbeforepaste 在選中區從系統剪貼板粘貼到文檔前在目標對象上觸發。
onbeforeupdate 當成功更新數據源對象中的關聯對象前在數據綁定對象上觸發。
onblur 在對象失去輸入焦點時觸發。
onchange 當對象或選中區的內容改變時觸發。
onclick 在用戶用鼠標左鍵單擊對象時觸發。