Question

我无法弄清楚为什么在搜索某些内容然后删除该搜索查询以搜索其他内容之后，该表没有显示任何内容，但仍在寻找正确的答案。

因此，在jsfiddle中，如果您键入001，然后删除它以尝试查找002，则显示的表将不再显示。任何帮助将不胜感激！

    let rows = document.querySelector("#Test").rows;// or much precise query if needed

function check(event) {
  let caps = event.target.value.toUpperCase();
  let hyphen = caps.replace(/[-]/g, ""); // Edit : caps + hyphen will work

  // Browse all rows to check if input matching and hide/show
  // Fortunately row.textContent yields all texts values :)
  for(let i = 1; i < rows.length; i++) {  
    let row = rows[i];

    // test caps length to allow revert to all hidden when no text to match
    if(caps.length && (row.textContent.indexOf(caps) >= 0 || row.textContent.indexOf(hyphen) >= 0)) { row.style.display = "";} // process next row
  else{  
    row.style.display = 'none'; // Hide row (avoid an else)  
  }


    }}
document.getElementById('myInput').addEventListener('keyup', check, true);

https://jsfiddle.net/jx8vw64L/9/

Answer 1

摆脱

caps.length &&

在您的情况下

 if((row.textContent.indexOf(caps) >= 0 || row.textContent.indexOf(hyphen) >= 0)) 
 { 
     row.style.display = "";
 } // process next row
 else
 { 
      row.style.display = 'none'; // Hide row (avoid an else)  
 }

Answer 2

您这样的html标记

 function textChange() {
   //DO SOME CODE
 }
<input type="text" name="foo" onKeyUp="return textChange()" />

与JQUERY一起使用

$('.target').change(function() {
   //DO SOME CODE
});

搜索一次后搜索栏不显示表格

2 个答案: