2012-01-12 4 views
5

私は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のでkeywordsアレイを使用してarr配列をフィルタリングすることができますか?この状況では、「SallyはTaco Bellで働いている」ということを除外し、残りの部分を保持します。

以下は私が使用している実際のコードです。

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配列に追加します。のJSONオブジェクトは、keywords配列を使用してフィルタリングされ、画面に追加されます。

私はまた動作していない削除フィルタ機能を持っています。多分誰かがそれを手伝ってくれるかもしれません。

+0

は、JavaScriptタグを追加しました。Btw、これらの配列はJavascript配列ではないようです... – kapa

+0

jQueryタグは質問と関係がないので削除しました。また、@bazmegakapaは正しいです。それらは有効なJavaScript配列ではありません。それはPHP配列のように見えます。 JavaScriptでは、単に角括弧を使用してください: 'var arr = [1,2,3]' –

+0

あなたは正しいです。申し訳ありません...私が書いたプログラムは、jQuery、Javascript、PHP、およびHTMLの組み合わせを使用しています。 – amlane86

答えて

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

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

+1クールネス。それは動作しますか? – qwertymk

+0

@qwertymkよくIE7とChromeでテストしただけですが、他のブラウザでは動作しません。レガシーブラウザで2番目のブラウザを使用している場合は、例えばMDNから '.filter'と' .bind'をシムする必要があります。 – Esailija

+0

[DEMO](http://jsfiddle.net/yDbGq/) – qwertymk

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

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) }) 
+0

私の意見では最高の答えは、それは私から幾分借りても、)。 –

+0

@ChrisPratt:私は何も借りなかった。 – georg

1
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]); 
    } 
} 

UPDATE

でより良い答えはjQueryの観点から、ここがありますので、私は私を修正VAへの回答jQueryを使用せずにこれを行う必要がある人のためだけに、JavaScriptのnillaメソッドを使用します。

+0

...と私は真剣に頭の頭のregex'esを考える必要があります。うまくやった。 :D '$ .grep()'関数を使ってそれを打つのがいいでしょう。 +1 –

+0

+1ループを書き出し、jQueryは必要ありません。D – jondavidjohn

+2

'for..in'を使用している場合は' hasOwnProperty() 'を含めることができます。正直なところ' for'では、オブジェクトではなく配列を扱います。 https://developer.mozilla.org/ja/JavaScript/Reference/Global_Objects/Object/hasOwnProperty – jondavidjohn

0

使用してjQueryの素晴らしい力: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("|") + ")"); 
}); 
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/

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); 

好きその後することができます(たぶん)を実行します。これはJavascriptの質問(jQueryのJavascriptのためのライブラリである)であるため、

var bar = $.foo(keywords, arr); 
関連する問題