javascript 點選回車相當於點選按鈕程式碼例項

antzone發表於2017-04-07
JavaScript

在很多時候，我們希望點選回車就像點選按鈕一樣，算是比較方面的一個舉措。

下面就通過一段程式碼例項介紹一下如何實現此功能。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script type="text/javascript" >
function calculate(){
  var a = document.getElementById("pre-tax").value;
  if(parseInt(a)>8000){
    document.getElementById("interest").value=800+ (a-8000)*15/100;
  } 
  else{
    document.getElementById("interest").value=a/10;
  }
}
//為keyListener方法註冊按鍵事件
document.onkeydown=keyListener;
function keyListener(e){
  // 當按下Enter鍵，執行我們的程式碼
  if(e.keyCode == 13){
    calculate();
  }
}
window.onload=function(){
  var obt=document.getElementById("calculate");
  obt.onclick=function(){calculate()}
}
</script>
 </head>
 <body >
 稅前薪資:<input type="text" id="pre-tax"/> 
 <input type="button" id="calculate" value="計算"/>
 利息:<input type="text" id="interest" readonly="readonly"/>
 </body> 
</html>

上面的程式碼實現了我們的要求，下面介紹一下它的實現過程。

一.程式碼註釋:

（1）.function calculate(){}，此方法實現了計算個稅的功能。

（2）.var a = document.getElementById("pre-tax").value，獲取工資值。

（3）.if(parseInt(a)>8000){

  document.getElementById("interest").value=800+ (a-8000)*15/100;

} ，如果工資大於8000，那麼就進行相關計算。

（4）.else{

  document.getElementById("interest").value=a/10;

}，否則的話使用另一種計算方式。

（5）.document.onkeydown=keyListener，為document註冊onkeydown事件處理函式。

（6）.function keyListener(e){

  // 當按下Enter鍵，執行我們的程式碼

  if(e.keyCode == 13){

    calculate();

  }

}判斷按鍵碼是不是13（enter鍵的按鍵碼），如果是則執行函式。

二.相關閱讀:

（1）.parseInt()方法可以參閱javascript parseInt()一章節。

（2）.onkeydown事件可以參閱javascript keydown事件一章節。

（3）.keyCode可以參閱javascript keyCode一章節。

相關文章