jQuery實現的監聽回車按鍵程式碼例項

螞蟻小編發表於2017-03-16
jQuery

Enter鍵是最為常用的按鍵之一，所以點選回車來執行一段程式碼是比較常見的操作，下面就通過例項程式碼介紹一下如何實現此功能。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title>  
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){ 
  $('input:text:first').focus(); 
  var $inp=$('input');
  $inp.keypress(function(e){
    var key=e.which;
    if(key==13){
      $(this).css("color","green");
    }
  }) 
})
</script>
</head>  
<body>  
<input type="text" value="螞蟻部落一"/>
<input type="text" value="螞蟻部落二"/>
<input type="text" value="螞蟻部落三"/>
</body>  
</html>

以上程式碼中，點選回車能夠將當前的文字框中的字型顏色設定為綠色。

相關閱讀:

1.focus()函式可以參閱jQuery focus 事件一章節。

2.keypress事件可以參閱jQuery keypress 事件一章節。

3.css()函式可以參閱jQuery css()一章節。 

4.which屬性可以參閱jQuery event.which一章節。

相關文章