Suchfilter im Array

Question

var klas = ['Nick Arts', 'Thijs Assmann', 'Rick Bats', 'Kim Cobben', 'Richard van Dartel', 'Dennis van Empel', 'Luuk van Gennip', 'Florent Guichard', 'Mahamed Hassan', 'Stijn Hendriks', 'Dirk van Herpen', 'Daniël Kartotaroeno', 'Tony van Klink', 'Stephan Klomp', 'Twan Korthout', 'Max Lenssen', 'Aron van der Linden', 'Aron de Looijer', 'Anil Manbodh', 'Sietse Manders', 'Ben Moerkens', 'Sven van Mourik', 'Teun Salters', 'Sven Slijkoord', 'Daan Soeten', 'Joey van Straalen', 'Koen van Veen', 'Maxim Westbroek']; 
<label>Zoek</label><input type="text" name=”zoek”> 

Hallo, ich muss einen Suchfilter mit diesem Array erstellen. Wenn ich 'van' in den Suchfilter eintippe, brauche ich die Ausgabe des Arrays mit dem ganzen 'van' darin.

Ich versuche schon über eine Hälfte unseres, kann es aber nicht finden, nur der erste Buchstabe funktioniert.

Dies ist, was ich bereits habe, aber ich kann es nur mit dem ersten Buchstaben finden.

function arrayzoek() { 
    document.getElementById('stopwatch').innerHTML = ''; 
    var woord = document.getElementById('woordInput').value; 
    var woord = woord.toUpperCase(); 
    var woord2 = woord.toLowerCase(); 

    for (var i = 0; i < klas.length; i++) { 
     if (woord == klas[i].charAt(0)) { 
      document.getElementById('stopwatch').innerHTML += klas[i] + '<br />'; 
     } 
    } 
} 

Danke.

Answer 1

Verwenden Sie string.indexof, um nach Teilstrings innerhalb eines Strings zu suchen.

function arrayzoek() { 
    var woord = document.getElementById('woordInput').value.toLowerCase(); 

    var results = klas.filter(function (x) { 
     return x.toLowerCase().indexOf(woord) > -1; 
    }); 

    document.getElementById('stopwatch').innerHTML = results.join('<br />'); 
} 

Answer 2

so würde ein Array mit allen Daten zurückgeben, die das Wort enthalten, das Sie finden möchten.

var search[]; 
    var woord = document.getElementById('woordInput').value; 
    for (var i = 0; i < klas.length; i++) { 
     if(i.indexOf(woord)!=-1) 
     { 
      search.push(i); 
     } 
    } 

Answer 3

var klas = ['Nick Arts', 'Thijs Assmann', 'Rick Bats', 'Kim Cobben', 'Richard van Dartel', 'Dennis van Empel', 'Luuk van Gennip', 'Florent Guichard', 'Mahamed Hassan', 'Stijn Hendriks', 'Dirk van Herpen', 'Daniël Kartotaroeno', 'Tony van Klink', 'Stephan Klomp', 'Twan Korthout', 'Max Lenssen', 'Aron van der Linden', 'Aron de Looijer', 'Anil Manbodh', 'Sietse Manders', 'Ben Moerkens', 'Sven van Mourik', 'Teun Salters', 'Sven Slijkoord', 'Daan Soeten', 'Joey van Straalen', 'Koen van Veen', 'Maxim Westbroek']; 
 

 
document.getElementById("txtZoek").addEventListener("keyup", arrayZoek, false); 
 

 
function arrayZoek() { 
 
    var inputWord = document.getElementById("txtZoek").value; 
 
    document.getElementById("stopwatch").innerHTML = ""; 
 
    if (inputWord !== "") { 
 
    for (var i = 0; i < klas.length; i++) { 
 
     if (klas[i].indexOf(inputWord) >= 0) { 
 
     document.getElementById("stopwatch").innerHTML += klas[i] + "<br/>"; 
 
     } 
 
    } 
 
    } else { 
 
    document.getElementById("stopwatch").innerHTML = ""; 
 
    } 
 
}

label { 
 
    margin-right: 10px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label>Zoek</label> 
 
<input type="text" id="txtZoek" /> 
 
<br/> 
 
<span id="stopwatch"></span>

bearbeiten
es geändert in einfachen Javascript-Code

Answer 4

Dies ist eine Lösung:

var klas = ['Nick Arts', 'Thijs Assmann', 'Rick Bats', 'Kim Cobben', 'Richard van Dartel', 'Dennis van Empel', 'Luuk van Gennip', 'Florent Guichard', 'Mahamed Hassan', 'Stijn Hendriks', 'Dirk van Herpen', 'Daniël Kartotaroeno', 'Tony van Klink', 'Stephan Klomp', 'Twan Korthout', 'Max Lenssen', 'Aron van der Linden', 'Aron de Looijer', 'Anil Manbodh', 'Sietse Manders', 'Ben Moerkens', 'Sven van Mourik', 'Teun Salters', 'Sven Slijkoord', 'Daan Soeten', 'Joey van Straalen', 'Koen van Veen', 'Maxim Westbroek']; 

var woord = document.getElementById('woordInput').value; 
var results = arrayzoek(woord, klas); 
document.getElementById('stopwatch').innerHTML = results.join('<br />'); 

function arrayzoek(input, data) { 
    var re = new RegExp(input, 'gi'); 
    var result = data.filter(function(item) { 
     return re.test(item); 
    }); 
    return result; 
} 

I t verwendet filter, regexp und join, was sehr nützlich und leistungsstarke javascript Vermögenswerte sind ...

Es trennt auch die DOM-Manipulation von reiner JavaScript-Funktion, die in einer konsistenteren Programmarchitektur führt.

Leider weiß ich nicht niederländische Sprache, so Variablen und Funktionsnamen wahrscheinlich verbesserungsfähig sind :)

Answer 5

var filteredArr = [],i,temp, regExp = /van/i; 
    temp= klas[i]; 

for(i =0;i<klas.length;i++){ 
    if(Array.isArray(temp) && regExp.test(temp)){ 
     filteredArr.push(temp) 
    } 
} 

alert(filteredArr) 

Answer 6

bereits. beachten Sie, dass i

$(function() { 
 
    var klas = ['Nick Arts', 'Thijs Assmann', 'Rick Bats', 'Kim Cobben', 'Richard van Dartel', 'Dennis van Empel', 'Luuk van Gennip', 'Florent Guichard', 'Mahamed Hassan', 'Stijn Hendriks', 'Dirk van Herpen', 'Daniël Kartotaroeno', 'Tony van Klink', 'Stephan Klomp', 'Twan Korthout', 'Max Lenssen', 'Aron van der Linden', 'Aron de Looijer', 'Anil Manbodh', 'Sietse Manders', 'Ben Moerkens', 'Sven van Mourik', 'Teun Salters', 'Sven Slijkoord', 'Daan Soeten', 'Joey van Straalen', 'Koen van Veen', 'Maxim Westbroek']; 
 
    $("#tags").autocomplete({ 
 
    source: klas 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
<div class="ui-widget"> 
 
    <label for="tags">Zoek:</label> 
 
    <input id="tags"> 
 
</div>

Answer 7

Hier jQuery verwendet haben, ist schöne Bibliothek, die Sie für die Suche und Verwaltung von Arrays

http://underscorejs.org/

find_.find (Liste, Prädikat hilft, [context]) Alias: detect Sucht durch jeden Wert in der Liste und gibt den ersten Wert zurück, der eine WahrheitübergibtTest (Prädikat) oder undefiniert, wenn kein Wert den Test besteht. Die Funktion gibt zurück, sobald ein akzeptables Element gefunden wird, und durchläuft nicht die gesamte Liste.

var even = _.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; }); 
=> 2 

nach Ihrem Beispiel:

var klas = ['Nick Arts', 'Thijs Assmann', 'Rick Bats', 'Kim Cobben', 'Richard van Dartel', 'Dennis van Empel', 'Luuk van Gennip', 'Florent Guichard', 'Mahamed Hassan', 'Stijn Hendriks', 'Dirk van Herpen', 'Daniël Kartotaroeno', 'Tony van Klink', 'Stephan Klomp', 'Twan Korthout', 'Max Lenssen', 'Aron van der Linden', 'Aron de Looijer', 'Anil Manbodh', 'Sietse Manders', 'Ben Moerkens', 'Sven van Mourik', 'Teun Salters', 'Sven Slijkoord', 'Daan Soeten', 'Joey van Straalen', 'Koen van Veen', 'Maxim Westbroek']; 



    return _.contains(klas, 'van');