基于字符串任意字母的搜索建议

Question

我正在尝试编写一些 java 脚本代码，可以这么说，自动建议基于预审字符串

这是我的意思的一个例子：

如果我们有字符串数组 => [ 'text', 'apple', 'texas', 'time', 'java', 'java script', 'pen' ]

我想要实现的是：当用户键入 ==> "te" 时，function 应该返回 ==> 'text' 和 'texas'

但

如果用户类型 ==> "t*e" OR "te" 在 function 之间有空格应该返回这个 ==> 'text', 'texas', AND 'time' 因为它包含两个字母，不管顺序如何

如果用户类型 ==> "p*e" OR "pe" 相同，结果应该是 ==> 'apple' 和 'pen' 因为 booth 包含字母 'p' 和 'e'

这是我到目前为止所做的

 const nameInput = document.getElementById('name') const names = [ 'text', 'apple', 'texas', 'time', 'java', 'java script', 'pen' ] nameInput.addEventListener('keyup', ()=> { // console.log(nameInput.value) const text = nameInput.value.trim().replace(/\s/g, '') // console.log(text) const a = names.filter(name => name.includes(text)) console.log(a) })

 <input type="text" placeholder="search" id="name">

Answer 1

根据您的帖子， t*e失败了，因为您没有在正则表达式中发现它们。 一种更可靠的方法是替换所有字母数字字符。 您可以通过将正则表达式稍微更改为/[\W_]+/g来快速完成

 const text = nameInput.value.trim().replace(/[\W_]+/g, '')

下面的工作代码

 const nameInput = document.getElementById('name') const names = ['text', 'apple', 'texas', 'time', 'java', 'java script', 'pen'] nameInput.addEventListener('keyup', () => { // console.log(nameInput.value) const text = nameInput.value.trim().replace(/[\W_]+/g, '') // console.log(text) const a = names.filter(name => name.includes(text)) console.log(a) })

 <input type="text" placeholder="search" id="name">