2012-01-12 15 views
5

Mam tablicę ciągów w jQuery. Mam kolejną tablicę słów kluczowych, które chcę użyć do filtrowania tablicy ciągów.Jak wziąć tablicę łańcuchów i przefiltrować je?

Moje dwie tablice:

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

Jak można filtrować tablicy arr pomocą tablicy w jQuery keywords? W tej sytuacji odfiltrowałoby "Sally pracuje w Taco Bell" i zatrzymałoby resztę.

Poniżej znajduje się aktualny kod, którego używam.

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

Celem tego jest umożliwienie użytkownikowi filtrowania wyników logów. Tak więc użytkownik wykonuje akcję, która rozpoczyna startTail() i $.getJSON() pobiera obiekt JSON, który jest zbudowany przez funkcję PHP i drukuje wyniki. Działa bezbłędnie. Teraz chcę dać użytkownikowi opcję filtrowania przychodzących elementów ogonowych. Użytkownik klika przycisk filtru, a jQuery pobiera tekst filtru i dodaje go do tablicy keywords, a następnie data.log z obiektu JSON jest filtrowany przy użyciu tablicy keywords, a następnie dołączany do ekranu.

Mam również funkcję usuwania filtra, która nie działa. Może ktoś może mi w tym pomóc.

+0

Dodany znacznik Javascript, ponieważ jest to kwestia Javascript (jQuery to biblioteka JavaScript).Btw, te tablice nie wydają się tablicami JavaScript ... – kapa

+0

Usunąłem również znacznik jQuery, ponieważ pytanie nie ma z tym nic wspólnego. Również @bazmegakapa ma rację. To nie są poprawne tablice JavaScript. To wygląda jak tablice PHP. W JavaScriptu po prostu użyj nawiasów kwadratowych: 'var arr = [1, 2, 3]' –

+0

Masz rację. Przepraszam ... program, który napisałem, wykorzystuje połączenie jQuery, JavaScript, PHP i HTML. Po prostu trochę się pomyliłem. – amlane86

Odpowiedz

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

bez jQuery:

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

+1 dla chłodu. Czy to działa? – qwertymk

+0

@qwertymk dobrze testowałem tylko w IE7 i chrome, bez powodu nie działałby w innych przeglądarkach. Jeśli używasz drugiego w starszej przeglądarce, musisz na przykład podkładać '.filter' i' .bind' z MDN. – Esailija

+0

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

0

Można użyć funkcji [filter][1], ale tak czy inaczej będziesz musiał przechodzić przez obie tablice. Możesz użyć indexOf, aby sprawdzić, czy ciąg znaków jest zawarty w innym ciągu.

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

słowo jQuery dla "filtr" jest 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

Najlepsza odpowiedź tutaj, moim zdaniem, nawet jeśli pożycza trochę od mojej;). –

+0

@ChrisPratt: Nic nie pożyczyłem. – 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

Ponieważ nie lepsze odpowiedzi tutaj z perspektywy jQuery, zmodyfikowałem mój odpowiedź na va nilla JavaScript podejście, tylko dla tych, którzy mogą potrzebować to zrobić bez jQuery.

+0

... i naprawdę muszę myśleć o regex'ach na szczycie głowy. ładnie wykonane. : D byłoby fajnie dodać do tego funkcję '$ .grep()'. +1 –

+0

+1 bardzo ładne rozwiązanie, wypisz pętlę i nie potrzeba jQuery: D – jondavidjohn

+2

Może chcesz dołączyć 'hasOwnProperty()' jeśli używasz 'for..in', chciałbym szczerze po prostu użyć zwykłego' dla ', masz do czynienia z tablicami, a nie obiektami. https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/hasOwnProperty – jondavidjohn

0

jQuery niesamowite moce:

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

skrzypce: http://jsfiddle.net/LQ92u/1/

1

czubku głowy i niesprawdzone. Jako jQuery plugin:

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

Następnie można (podobno) run, które lubię:

var bar = $.foo(keywords, arr); 
Powiązane problemy