【问题标题】:Comparing two variables sting array to see if any value matches - javascript jquery比较两个变量字符串数组以查看是否有任何值匹配 - javascript jquery
【发布时间】:2012-07-24 14:42:46
【问题描述】:

您好,我正在尝试将两个数组相互比较,然后在任何值匹配时隐藏列表元素。

一个数组是附加到列表项的标签,另一个是用户输入。

我遇到了麻烦,因为我似乎能够交叉引用一个用户输入的工作并且无法针对多个标签获取多个单词。

用户输入词的数量可能会改变,标签的数量可能会改变。我试过inArray,但没有运气。任何帮助将非常感激。见以下代码:

function query_searchvar() {
   var searchquery=document.navsform.query.value.toLowerCase();
   if (searchquery == '') {
      alert("No Text Entered");
   }
   var snospace = searchquery.replace(/\s+/g, ',');
   event.preventDefault();
   var snospacearray = snospace.split(',');

   $('li').each(function() {
      var searchtags = $(this).attr('data-searchtags');
      //alert(searchtags);
      var searcharray = searchtags.split(',');
      //alert(searcharray);
      var searchtrue=-1;

      for(var i = 0, len = searcharray.length; i < len; i++){
          if(searcharray[i] == searchquery){
              searchtrue = 0;
              break;
          }
      }
      if (searchtrue == 0) {
         $(this).show("normal");
      }
      else {
         $(this).hide("normal");
      }
   });
}

好的,所以我尝试实现下面的代码,但没有运气。它似乎没有检查两个数组。

function query_searchvar()
{
var searchquery=document.navsform.query.value.toLowerCase();
if(searchquery == '')
{alert("No Text Entered");
}
var snospace = searchquery.replace(/\s+/g, ' ');
event.preventDefault();
var snospacearray = snospace.split(' ');
alert(snospacearray[1]);

$('li').each(function() {
  var searchtags = $(this).attr('data-searchtags');
  alert(searchtags);
  var searcharray = searchtags.split(' ');
    alert(searcharray[0]);

jQuery.each(snospacearray, function(key1,val1){
    jQuery.each(searcharray,function(key2,val2){
        if(val1 !== val2) {$(this).hide('slow');}
    });
});
});
}

工作代码:

function query_searchvar()
{
var searchquery=document.navsform.query.value.toLowerCase();
if(searchquery == '')
{alert("No Text Entered");
}
var queryarray = searchquery.split(/,|\s+/);

event.preventDefault();


$('li').each(function() {
  var searchtags = $(this).attr('data-searchtags');
  //alert(searchtags);
  var searcharray = searchtags.split(',');
//alert(searcharray);
var found = false;
for (var i=0; i<searcharray.length; i++)
    if ($.inArray(searcharray[i], queryarray)>-1) {
        found = true;
        break;
    }

if (found == true )
  {

 $(this).show("normal");
  }
else {
$(this).hide("normal");
}
});
}

【问题讨论】:

  • 看起来您正在将一个数组与一个字符串进行比较,而不是两个数组。
  • 也许尝试为搜索标签、搜索数组、snospace 数组添加一些控制台日志?你确认所有的值都是正确的吗?尝试用 != 替换 if(val1 !== val2) 看看是否有帮助?
  • 我有一个问题:我可以嵌套 .each 函数吗?所以我有 $('li').each(function 并且在里面我有其他的 .each 函数。当我使用 this.hide 时,它​​没有拾取 li 项目。另外,当我提醒 val1 和 val2 时,我没有得到数组中的元素。你认为我的数组设置错误吗。非常感谢你的帮助。
  • 这在firefox中似乎不起作用,输入框不会保存到数组中。有人知道这是不是 Firefox 的问题吗?

标签: javascript jquery arrays string user-input


【解决方案1】:
var snospace = searchquery.replace(/\s+/g, ',');
var snospacearray = snospace.split(',');

请注意,您可以在正则表达式上进行拆分,因此上述内容等于:

var queryarray = searchquery.split(/,|\s+/);

要查找两个数组中是否包含一个项目,请使用以下代码:

var found = searcharray.some(function(tag) {
    return queryarray.indexOf(tag) > -1;
});

虽然这仅适用于符合 ES5 的浏览器 :-) 要支持其他浏览器,请使用

var found = false;
for (var i=0; i<searcharray.length; i++)
    if ($.inArray(searcharray[i], queryarray)>-1) {
        found = true;
        break;
    }

在纯js中,没有jQuery.inArray

var found = false;
outerloop: for (var i=0; i<searcharray.length; i++)
    for (var j=0; j<queryarray.length; j++)
        if (searcharray[i] == queryarray[j]) {
            found = true;
            break outerloop;
        }

稍微快一点的算法(仅对非常大的数组需要)是在线性遍历它们之前对两个数组进行排序。

【讨论】:

  • 唯一的问题是数组长度可以变化,所以一个可能比另一个长。
  • 当然可以。代码将搜索所有项目,直到找到一个。
  • 谢谢它的工作,非常感谢。我仍然不确定这是如何工作的。如果我有 searcharray.length 是指这个数组的长度吗?如果另一个数组中的其他项更长,它看起来如何?
  • 是的,length property of Arrays 指的是数组实例的长度。并且循环只是遍历所有 indizes 直到长度,以便遍历每个项目。
【解决方案2】:

这是可以解决您的问题的伪代码。

get both arrays
for each item in array 1
    for each element in array 2
        check if its equal to current element in array 1
           if its equal to then hide what you want

这种聪明的例子是

jQuery.each(array1, function(key1,val1){
    jQuery.each(array2,function(key2,val2){
        if(val1 == val2) {$(your element to hide).hide();}
    });
});

如果有什么不懂的请追问:)

【讨论】:

  • 您好,非常感谢您的回复。我会试一试,看看我能不能让它工作。非常感谢,非常有帮助。
  • 好的,会的。实现后我会更新新代码。
  • 嗨,我没能成功。我在想我没有正确设置数组或其他东西。
  • query_searchvar() { var searchquery=document.navsform.query.value.toLowerCase(); if(searchquery == '') {alert("未输入文本"); } var snospace = searchquery.replace(/\s+/g, ','); event.preventDefault(); var snospacearray = snospace.split(','); //警报(snospacearray[1]); $('li').each(function() { var searchtags = $(this).attr('data-searchtags'); //alert(searchtags); var searcharray = searchtags.split(','); jQuery .each(snospacearray, function(key1,val1){ jQuery.each(searcharray,function(key2,val2){ if(val1 !== val2) {$(this).hide('slow');} }); }); }); }
  • 您可以编辑您的问题以包含此代码,因为它在这里不可用
猜你喜欢
  • 2018-05-14
  • 1970-01-01
  • 1970-01-01
  • 2010-09-13
  • 2010-11-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多