javascript - 纯javascript,过滤框无法正确过滤

标签 javascript arrays filter match

我有一个设备数组,每个设备都有自己唯一的ID,我希望制作searchBox,它将按此ID进行过滤。到目前为止,我已经部分管理了它,因此它检查输入中的字符是否与设备 ID 中的字符匹配。但不是我想要的方式,例如下面的:

id =35678; input.value = 5

它不应该工作,因为第一个字符是3

id = 35679; input.value= 35

它应该工作,因为第一个字符是相同的

问题出在匹配/包含函数中,但不知道如何替换它以使其工作

input_box.addEventListener('keyup', function(){
  var search_result = this.value;
  var device = document.querySelectorAll('[device_id]')
  var array_of_devices = [];
  for (var i = 0; i < device.length; i++) {
       array_of_devices.push(device[i].getAttribute('device_id'))
  }
  array_of_devices.forEach(el => {
         if (!el.match(search_result)) {
           var not_matched = document.querySelector(`[device_id="${el}"]`)
           not_matched.style.display = "none"    
         } else {
          var matched = document.querySelector(`[device_id="${el}"]`)
          matched.style.display = "block"    
        }
     })
 })

最佳答案

您可以使用startsWith而不是匹配

let arr = ['35678', '451234', '45454', '56565']

let find = (value) =>{
  return arr.filter(id=> id.startsWith(value))
}

console.log(find(5))
console.log(find(35))
console.log(find(46))

关于javascript - 纯javascript,过滤框无法正确过滤,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56337102/

相关文章:

javascript - 过滤器列表 - 根据计数键删除两个重复项中较小的一个

android - 数组适配器 : Json data to be sent to spinner

javascript - 过滤功能不适用于日期(javascript)

apache-spark - Apache Spark : Unexpected filter results

javascript - Google 云端硬盘脚本不起作用,

javascript - MongoDB 按小时分组

javascript - 如何在 Asp.net 的静态方法服务器端代码中执行 JavaScript 警报?

javascript - Angular $cookieStore 无法在 Controller $scope 函数下工作

php - 如何在 PHP 中获取子数组?

scala - 在 map 中组合过滤器