用JavaScript擷取輸入的特殊字元

最後更新：2018-12-08 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

Web開發時可能經常會用到在keyPress時獲得輸入的字元。String.fromCharCode()可以來實現這個，不過這個函數在你使用Shift鍵來輸入特殊字元時就不管用了，需要改造一下，這個文章給出了改造的方法，經測試在各種主流瀏覽器均正常。

<html><head><title >mapKeyPressToActualCharacter test</title><script language="javascript" type="text/javascript">    function onKeyPress() {         var e = window.event || e;        var keyCode = e.keyCode;         if (keyCode == 8) {            this.criteria.value = this.criteria.value.substring(                    0, this.criteria.value.length - 1);        }        else {            this.criteria.value                += mapKeyPressToActualCharacter(event.shiftKey, keyCode);        }     }     function mapKeyPressToActualCharacter(isShiftKey, characterCode) {        if (characterCode === 27            || characterCode === 8            || characterCode === 9            || characterCode === 20            || characterCode === 16            || characterCode === 17            || characterCode === 91            || characterCode === 13            || characterCode === 92            || characterCode === 18) {            return false;        }        if (typeof isShiftKey != "boolean" || typeof characterCode != "number") {            return false;        }        var characterMap = [];        characterMap[192] = "~";        characterMap[49] = "!";        characterMap[50] = "@";        characterMap[51] = "#";        characterMap[52] = "$";        characterMap[53] = "%";        characterMap[54] = "^";        characterMap[55] = "&";        characterMap[56] = "*";        characterMap[57] = "(";        characterMap[48] = ")";        characterMap[109] = "_";        characterMap[107] = "+";        characterMap[219] = "{";        characterMap[221] = "}";        characterMap[220] = "|";        characterMap[59] = ":";        characterMap[222] = "\"";        characterMap[188] = "<";        characterMap[190] = ">";        characterMap[191] = "?";        characterMap[32] = " ";        var character = "";        if (isShiftKey) {            if (characterCode >= 65 && characterCode <= 90) {                character = String.fromCharCode(characterCode);            } else {                character = characterMap[characterCode];            }        } else {            if (characterCode >= 65 && characterCode <= 90) {                character = String.fromCharCode(characterCode).toLowerCase();            } else {                character = String.fromCharCode(characterCode);            }        }        return character;    } </script> </head><body>    <input name="test" type="text" onkeypress="onKeyPress();"/></body></html>

測試結果，在Firefox, Chrome and IE.和Safari下均通過：

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More