說說 input 輸入框的事件

從input框獲取焦點到，輸入值，失去焦點這個過程所有事件，以及一些特點；

1、過程

onfocus -> 鍵盤輸入 -> onkeydown -> onkeypress -> onkeyup -> oninput -> 失去焦點 ->  onchange -> onblur

如下，奉上**；

function handlefocus (event

) ; function handlekeydown (
event
) function handlekeypress (
event
) function handlekeyup (
event
) function handleinput (
event
) function handlechange (
event
) ; function handleblur (
event
) 

其實這個過程並沒有很意外，唯一感覺不太對勁的是onchange 事件並不是每次輸入框值改變的時候觸發的，而是在失去焦點時候，並且在 onblur 之前觸發；

2、說說這些事件

onfocus

並沒有什麼特別的，就是當焦點轉移到（點選，tab切換） input 框上邊的時候觸發；

onkeydown

鍵盤按下的時候觸發，但是此時按下的值並沒有被輸入到 input ，所以，此時的 value 沒有值，或者說它的值 只能是之前的舊值

另外，此時可以阻止按鍵的預設事件；

onkeypress

按鍵在按下之後，並且是按鍵鬆開之前觸發的；

和 keydown 一樣不能獲取新的到 value；此時，也可以阻止按鍵的預設事件；

但是這個事件對一下按鍵的支援不好，一些非輸入性質的按鍵（如；delete, backspare）不支援；（除enter）；

oninput

這個事件很賊，它的觸發時機，從上面就可以看到，onpress 之後 onkeyup 之前；

此時，已經可以拿到 value，不能拿到keycode，不可以阻止預設事件了 ；

關鍵是這貨明明是每次輸入框的值變化時候出發的，搶了onchange 的飯碗；

另外，這東西是新的，ie9以下不支援，需要使用 onpropertychange；

還有這貨，僅僅在input， textarea 支援；

onkeyup

按鍵在鬆開之後觸發的；

能獲取新的到 value，keycode；此時，不可以阻止按鍵的預設事件；

onchange

你敢說這是你認識的onchange嗎？反正我是不敢；在失去焦點之後觸發的，明明是 onchange 為什麼是在失去焦點後觸發的，還偏偏比 onblur 快；

能獲取新的到 value，不能拿到 keycode；此時，不可以阻止按鍵的預設事件；

onblur

失去焦點時候觸發，但是還是比 onchange 慢了；

能獲取新的到 value，不能拿到 keycode；

input輸入框新增鍵盤事件

1 普通input輸入框新增鍵盤事件，keyup keydown,假設打算按enter鍵。搜尋 type text keyup.enter search 除了那幾個特殊鍵，其餘按鍵的呼叫可以將enter換成對應鍵盤碼即可。2 element ui中input輸入框新增鍵盤事件。搜尋 keyup.en...

input 輸入框限制

只能輸入數字和乙個小數點 function clearnonum obj g,只保留第乙個.清除多餘的 obj.value obj.value.replace replace g,replace obj.value obj.value.replace d d 1 2.3 只能輸入6個小數 親測有用！...

input 輸入框的事件觸發及其順序

function g type,selector g id field onkeyup function g id field onkeypress function g id field onkeydown function g id field onfocus function g id fie...