DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript使用鍵盤輸入控制實現數字驗證功能
JavaScript使用鍵盤輸入控制實現數字驗證功能
編輯:關於JavaScript     

現在有一個需求如下圖:

產品經理說Card Number只能讓輸入數字(中間的空格是格式自加的,也是用js實現的),有時候我腦海中出現了個聲音,啥玩意,加個type=number不就行了,事實發現圖樣圖森破了,先不說type=number後面會有個上下標(雖然用css可干掉),但是這個類型是支持科學輸入法的,就是小數點和e這樣的是可以輸入的,於是乎只能用其他的方式了,後來想用檢索到輸入了非數字就干掉,但是這樣還是能輸入,想法被打回,於是乎最終采用了鍵盤輸入控制的辦法,其實很簡單,代碼如下:

  var isNumber=function(keyCode){
        // 數字
        if (keyCode >= 48 && keyCode <= 57) {
          return true;  
        }
          // 小數字鍵盤
        if (keyCode >= 96 && keyCode <= 105) {
          return true;
        }
          //tab Backspace, del, 左右方向鍵
        if (keyCode == 9||keyCode == 8|| keyCode == 32 || keyCode == 46 || keyCode == 37 || keyCode == 39) {
          return true;
        }
        return false
      }

所謂鍵盤輸入控制就是根據鍵盤輸入的keycode來判斷輸入的是什麼類型,即獲取按下的鍵盤按鍵Unicode值,鍵盤上每個按鍵對應的keycode是固定的,網上有很多對照表,我這裡就不貼上去了,每一次按鍵監測到對應的keycode然後對照是否合法,需要注意的是這裡合法的不僅是數字,還有上下左右tab和空格方向鍵,不能禁用用戶的操作指令,怎麼樣,看起來很簡單吧。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved