用javascript隐藏div元素

下面是代码，我在div中显示匹配的用户输入，但是当没有匹配的用户输入时，我想隐藏div。我似乎无法使用以下代码执行此操作：

HTML代码：

 <input id="filter" type="text" placeholder="Enter your filter text here.." onkeyup = "test()" />

 <div id="lc">  <p id='placeholder'> </p>  </div>

JS代码：

 // JavaScript Document

 s1= new String()
 s2= new String()
 var myArray = new Array();

 myArray[0] = "Football";
 myArray[1] = "Baseball";
 myArray[2] = "Cricket";
 myArray[3] = "Hockey";
 myArray[4] = "Basketball";
 myArray[5] = "Shooting";

 function test()
 {
 s1 = document.getElementById('filter').value;
 var myRegex = new RegExp((s1),"ig");
  arraysearch(myRegex);
  }

 function arraysearch(myRegex)
 {
  document.getElementById('placeholder').innerHTML=""; 
for(i=0; i<myArray.length; i++)
{ 
if (myArray[i].match(myRegex))
{ 
   document.getElementById('lc').style.visibility='visible';
   document.getElementById('placeholder').innerHTML += myArray[i] + "<br/>";
}
    else
    {
   document.getElementById('lc').style.visibility='hidden';
    }
}

    }

---

正则表达式是一种功能强大的工具，但在如此琐碎的工作中使用它们通常会很麻烦。首先，您使用的是直接输入作为正则表达式，这从来没有这么好

我复制了你的代码并分析了你犯下许多错误的逻辑

考虑上面的代码，如果我输入football，它将与football匹配，并显示football。接下来，它会检查不匹配的棒球，并且可见性更改为隐藏

更好的逻辑

1.检查哪些字符串匹配，并将它们添加到除法中

2.检查匹配的字符串数量，如果没有，则将可见性更改为隐藏

您正在使用正则表达式，而实际上可以通过indexOf轻松实现这一点

---

这些都是纯逻辑错误

请考虑使用jquery。有一点实用性

var myArray = ["Football", "Baseball", "Cricket","Hockey", "Basketball", "Shooting"] $("#filter").keyup(function() { if(_.include(myArray, $(this).val()) { $('#lc').show() } else { $('#lc').hide() } }

---

首先添加一些警报，并尝试查看代码到底出了什么问题。启动javascript控制台查看错误。如果您使用的是旧版本的IE。请严格使用varYes声明变量，只需找出愚蠢的错误。添加了一个标志以检查是否找到任何匹配项。现在一切正常！ var myArray = ["Football", "Baseball", "Cricket","Hockey", "Basketball", "Shooting"] $("#filter").keyup(function() { if(_.include(myArray, $(this).val()) { $('#lc').show() } else { $('#lc').hide() } }