题解 | #智能提示#
智能提示
http://www.nowcoder.com/practice/efccf73b4ceb4446b6d71127f874e6d3
function suggest(items) { window.items=items; let input=document.getElementsByClassName('js-input')[0]; input.addEventListener('input', onInput); // 此处有坑,测试用例用js直接更改的value属性,导致监听不到input,必须手动输入下一行 // input.addEventListener('change', onInput); onInput({ target: input }); } function onInput(e){ let input=e.target.value.trim(); //let reg=new RegExp(input,'g'); let matchList=[]; let reg = new RegExp( input .replace(/([\\\/\(\)\+\*\?\:\\[\]\^\$])/g, "\\$1") .replace(/(\\.)/g, "$1.*?") );//这个是难点:变量生成正则匹配,有点难 if(!!input){ items.forEach(v=>{ if(reg.test(v)){ matchList.push(v); } }); } let div=document.getElementsByClassName('js-suggest')[0]; let ul=div.children[0]; if(matchList.length===0){ div.classList.add('hide'); ul.innerHTML=''; }else{ ul.innerHTML=matchList.map(v=>`<li>${v}</li>`).join(''); div.classList.remove('hide'); } }