如何获取字符串数组并过滤它们?

时间:2012-01-12 17:53:18

标签: javascript jquery arrays filter

我在jQuery中有一个字符串数组。我有另一个关键字数组,我想用来过滤字符串数组。

我的两个阵列:

    var arr = new Array("Sally works at Taco Bell", "Tom drives a red car", "Tom is from Ohio", "Alex is from Ohio");

    var keywords = new Array("Tom", "Ohio");

如何使用jQuery中的arr数组过滤keywords数组?在这种情况下,它会过滤掉“莎莉在塔可钟的作品”并保留其余部分。

以下是我正在使用的实际代码。

var keywords= [];
var interval = "";
var pointer = '';
var scroll = document.getElementById("tail_print");

$("#filter_button").click(
function(){
    var id = $("#filter_box").val(); 
    if(id == "--Text--" || id == ""){
        alert("Please enter text before searching.");
    }else{
        keywords.push(id);
        $("#keywords-row").append("<td><img src=\"images/delete.png\" class=\"delete_filter\" /> " + id + "</td>");
    }
}
);

$(".delete_filter").click(
function(){
   ($(this)).remove(); 
}
);

function startTail(){
clearInterval(interval);
interval = setInterval(
function(){
    $.getJSON("ajax.php?function=tail&pointer=" + pointer + "&nocache=" + new Date(),
        function(data){
            pointer = data.pointer;
            $("#tail_print").append(data.log);
            scroll.scrollTop = scroll.scrollHeight;
        });
}, 1000);
}

这样做的目的是允许用户过滤日志结果。因此,用户执行一个动作,启动startTail()$.getJSON()检索由PHP函数构建的JSON对象并打印结果。工作完美无瑕。现在我想让用户选择过滤传入的拖尾项目。用户单击过滤器按钮,jQuery获取过滤器文本并将其添加到keywords数组,然后使用data.log数组过滤JSON对象中的keywords,然后将其附加到屏幕

我还有一个无效的删除过滤功能。也许有人可以帮助我。

7 个答案:

答案 0 :(得分:8)

$.grep( arr, $.proxy(/./.test, new RegExp(keywords.join("|"))));

没有jQuery:

arr.filter(/./.test.bind(new RegExp(keywords.join("|"))));

答案 1 :(得分:4)

jQuery的“过滤器”一词是grep

var arr = ["Sally works at Taco Bell", "Tom drives a red car", "Tom is from Ohio", "Alex is from Ohio"];
var keywords = ["Tom", "Ohio"];

var regex = new RegExp(keywords.join("|"));

result = $.grep(arr, function(s) { return s.match(regex) })

答案 2 :(得分:2)

var filtered = [];
var re = new RegExp(keywords.join('|'));

for (var i=0; i<arr.length; i++) {
    if (re.search(arr[i])) {
        filtered.append(arr[i]);
    }
}

<强>更新

由于从jQuery的角度来看这里有更好的答案,我修改了一个vanilla JavaScript方法的答案,仅适用于那些可能需要在没有jQuery的情况下执行此操作的人。

答案 3 :(得分:1)

头顶,未经测试。作为jQuery插件:

(function($) {

    $.foo = function(needle, haystack) {
        return $.grep(haystack, function () {
            var words = this.split(' '),
                flag = false
                ;

            for(var i=0; i < words.length; i++) {
                flag = $.inArray(words[i], needle);
                if (flag) { break; }
            }

            return flag;                
        });
    };

})(jQuery);

然后你可以(据说)运行:

var bar = $.foo(keywords, arr);

答案 4 :(得分:0)

您可以使用[filter][1]函数,但无论哪种方式,您都需要遍历两个数组。您可以使用indexOf检查字符串是否包含在另一个字符串中。

var arr = ["Sally works at Taco Bell", "Tom drives a red car", "Tom is from Ohio", "Alex is from Ohio"];
var keywords = ["Tom", "Ohio"];
var filtered = [];

for(var i = 0; i < arr.length; i++) {
    for(var j = 0; j < keywords.length; j++) {
        if (arr[i].indexOf(keywords[j]) > -1) {
            filtered.push(arr[i]);
            break;
        }
    }
}

console.log(filtered);

Live example

答案 5 :(得分:0)

使用jQuery强大功能:

var keywords = ["Tom", "Ohio"];
$(["Sally works at Taco Bell", "Tom drives a red car", "Tom is from Ohio", "Alex is from Ohio"]).filter(function(k, v) {
    return v.match("(" + keywords.join("|") + ")");
});

答案 6 :(得分:0)

var keywords = ['Tom', 'Ohio'];
var arr = ['Sally works at Taco Bell', 'Tom drives a red car', 'Tom is from Ohio', 'Alex is from Ohio'];
var matcher = new RegExp(keywords.join('|'));
var newarr = [];
$.each(arr, function(index, elem) {
   if (elem.match(matcher)) {
      newarr.push(elem);
   }
});
console.log(newarr);

小提琴:http://jsfiddle.net/LQ92u/1/