JS-常規匹配數組和字符串

Question

第一篇文章，請保持溫柔； D

碼：

var matchString;
var searchString = '';
var lastKey;
function keyDown(e) {
  if (!e)
    e = window.e;
    for (var i=0; i<asciiNum.length;i++){
        if (e.keyCode == asciiNum[i]){
            console.log('asciiLet: '+asciiLet[i]);
            lastKey = asciiLet[i];
            searchString +=lastKey;
        }else if(e.keyCode == "27"){
            searchString="";
            console.log(searchsrtring)
        }
    }
}

function keyUp(e) {
    console.log('left: '+searchString)
    for (var i=0; i<champArray.length; i++){
    }

}

數組：

var nameArray = ["aatrox","ahri","akali","alistar","amumu","anivia","annie","ashe", "blitzcrank",   "brand",    "caitlyn",  "cassiopeia",   "cho'gath", "corki",    "darius",   "diana",    "draven",   "dr. mundo",    "elise",    "evelynn",  "ezreal",   "fiddlesticks", "fiora",    "fizz", "galio",    "gangplank",    "garen",    "gragas",   "graves",   "hecarim",  "heimerdinger", "irelia",   "janna",    "jarvan iv",    "jax",  "jayce",    "karma",    "karthus",  "kassadin", "katarina", "kayle",    "kennen",   "kha'zix",  "kog'maw",  "leblanc",  "lee sin",  "leona",    "lissandra",    "lucian",   "lulu", "lux",  "malphite", "malzahar", "maokai",   "master yi",    "m.fortune",    "mordekaiser",  "morgana",  "nami", "nasus",    "nautilus", "nidalee",  "nocturne", "nunu", "olaf", "orianna",  "pantheon", "poppy",    "quinn",    "rammus",   "renekton", "rengar",   "riven",    "rumble",   "ryze", "sejuani",  "shaco",    "shen", "shyvana",  "singed",   "sion", "sivir",    "skarner",  "sona", "soraka",   "swain",    "syndra",   "talon",    "taric",    "teemo",    "thresh",   "tristana", "trundle",  "tryndamere",   "twitch",   "twisted fate", "udyr", "urgot",    "varus",    "vayne",    "veigar",   "vi",   "viktor",   "vladimir", "volibear", "warwick",  "wukong",   "xerath",   "xin zhao", "yorick",   "zac",  "zed",  "ziggs",    "zilean",   "zyra", "jinx"];
    var asciiNum = ['27','65','66','67','68','69','70','71','72','73','74','75','76','77','78','79','80','81','82','83','84','85','86','87','88','89','90']
    var asciiLet=  ['Esc','a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']

所以，我想做什么：實際上，我想在每個按下的鍵中都將searchstring的內容與nameArray進行匹配。 最后，每個不以fe“ A”開頭的元素都應淡出。 希望大家能聽懂我的英語，並會憐憫我（：

Answer 1

你可以這樣做

1. 將keyDown回調添加到輸入中（我假設它是HTMLInputElement ）

2. 在keyDown回調延遲中，將調用searchNameFromInput函數，以便在檢查輸入時已經更改了輸入的值。

3. 通過創建一個正則表達式來過濾nameArray的元素，該正則表達式nameArray檢查名稱是否與您的輸入值匹配（例如： "an"將匹配"anivia"和"annie" ）

代碼看起來像這樣

var nameArray = ["aatrox","ahri","akali","alistar","amumu","anivia","annie","ashe", "blitzcrank",   "brand",    "caitlyn",  "cassiopeia",   "cho'gath", "corki",    "darius",   "diana",    "draven",   "dr. mundo",    "elise",    "evelynn",  "ezreal",   "fiddlesticks", "fiora",    "fizz", "galio",    "gangplank",    "garen",    "gragas",   "graves",   "hecarim",  "heimerdinger", "irelia",   "janna",    "jarvan iv",    "jax",  "jayce",    "karma",    "karthus",  "kassadin", "katarina", "kayle",    "kennen",   "kha'zix",  "kog'maw",  "leblanc",  "lee sin",  "leona",    "lissandra",    "lucian",   "lulu", "lux",  "malphite", "malzahar", "maokai",   "master yi",    "m.fortune",    "mordekaiser",  "morgana",  "nami", "nasus",    "nautilus", "nidalee",  "nocturne", "nunu", "olaf", "orianna",  "pantheon", "poppy",    "quinn",    "rammus",   "renekton", "rengar",   "riven",    "rumble",   "ryze", "sejuani",  "shaco",    "shen", "shyvana",  "singed",   "sion", "sivir",    "skarner",  "sona", "soraka",   "swain",    "syndra",   "talon",    "taric",    "teemo",    "thresh",   "tristana", "trundle",  "tryndamere",   "twitch",   "twisted fate", "udyr", "urgot",    "varus",    "vayne",    "veigar",   "vi",   "viktor",   "vladimir", "volibear", "warwick",  "wukong",   "xerath",   "xin zhao", "yorick",   "zac",  "zed",  "ziggs",    "zilean",   "zyra", "jinx"],
input = document.getElementById('foo');

// I also assume IE9+ for addEventListener
input.addEventListener('keydown', function keyDown(e) {
    e = e || window.event;
    // just bind the input element as a parameter
    // for the function searchNameFromInput
    setTimeout(searchNameFromInput.bind(null, e.target||e.srcElement), 80);
}, false);

function searchNameFromInput(input) {
    if (input.value.length) {
         console.log(
            nameArray.filter(function (name) {
                return new RegExp('^' + input.value).test(name);
            })
        );
    }
}