1

以下是我在 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';
    }
}

    }
4

2 回答 2

0

考虑使用 jquery。（带有一点http://underscorejs.org/的实用程序）

var myArray = [“足球”、“棒球”、“板球”、“曲棍球”、“篮球”、“射击”]

$("#filter").keyup(function() {
  if(_.include(myArray, $(this).val()) {
    $('#lc').show()
  } 别的 {
    $('#lc').hide()
  }
}
于 2012-09-26T18:17:21.177 回答
0

正则表达式是一个强大的工具，但将它们用于如此微不足道的工作通常很麻烦。首先，您使用直接输入作为正则表达式，这从来都不是那么好。

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

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';
    }

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

更好的逻辑

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

2.检查有多少字符串匹配，如果没有，将可见性更改为隐藏。

当这实际上可以通过 indexOf() 轻松实现时，您正在使用正则表达式；

这些纯属逻辑错误

于 2012-09-26T18:08:56.650 回答