2013-04-15 102 views
8

我有一個輸入,我只想添加一個事件監聽器來激活一個功能,當我按下輸入,當輸入焦點。我如何用純JS做到這一點?執行功能輸入鍵

現在我有:

HTML:

 Enter your wage:<input type="text" id="wage" value ="" size=20> 
     <button id="sub">Submit</button> 

的Javascript:當我點擊或更改文本

var wage = document.getElementById("wage"); 
    wage.addEventListener("change", validate); 

    var btn = document.getElementById("sub"); 
    btn.addEventListener("click", validate); 

所以基本功能的validate()激活,但我想通過按回車來調用它。

回答

16

您可以使用此:

var wage = document.getElementById("wage"); 
wage.addEventListener("keydown", function (e) { 
    if (e.keyCode === 13) { //checks whether the pressed key is "Enter" 
     validate(e); 
    } 
}); 

function validate(e) { 
    var text = e.target.value; 
    //validation of the input... 
} 

Live demo here

+0

+1。儘管你可以用'validate()'替換'alert()'。 – nnnnnn

+0

是的,更改:-) –

+1

謝謝。這是否適用於所有瀏覽器? – frrlod

0

你會需要一個像 wage.addEventListener('keydown', validate);

您的驗證功能的東西就那麼需要檢查event.keyCode == 13確定 '進入' 按鍵。

0

如果您的按鈕元素更改爲

<input type="submit" value="Submit"> 

它會與你的鍵盤上的回車鍵工作。

4
var elem = document.getElementById("wage"); 
elem.onkeyup = function(e){ 
    if(e.keyCode == 13){ 
     validate(); 
    } 
} 

工作實例http://jsfiddle.net/aMgLK/

0

或者用jQuery

$("#wage").on("keydown", function (e) { 
    if (e.keyCode === 13) { //checks whether the pressed key is "Enter" 
     validate(e); 
    } 
}); 
0
$(document).on('keyup', function(e){ 
    var key = e.which; 
    if(key == 13) // the enter key ascii code 
    { 
     login(); 
    } 
});