ricerca di testo in javascript?

Ho una pagina con più di 200 collegamenti con questo tipo di formattazione.ricerca di testo in javascript?

<h1> 
    <a href="somelink">Somelink</a> 
    some text that explain the meaning of the link. 
</h1>

Ora, per semplificare la ricerca attraverso questo collegamento, ho messo una casella di ricerca.

Il mio requisito è quello di cercare attraverso tutti questi tag e trovare i collegamenti che sono rilevanti per la casella di ricerca e nascondere resto del collegamento.

Come si fa in javascript? (Conosco javascript di base/roba da jquery ma come fare la ricerca a testo integrale?) Non ho bisogno di ordinare in base alla pertinente, solo il filtro e mostrare nascondere è abbastanza buono.

fonte

2010-07-18 iamgopal

Sono tutti in tag h1 per caso? –

ci sono più tag h1, da 200 a ultimo conteggio. Non desidero una ricerca lato server per motivi di velocità, e le dimensioni combinate di tutti i 200 collegamenti difficilmente superano 10 kb. – iamgopal

Speriamo che hai trovato utile. Probabilmente non è l'elegante o il più efficiente, ma ti consente di inserire più termini di ricerca e dà corrispondenze parziali (che possono o non possono essere ricercate). Il modo in cui l'ho fatto quando fai clic sul pulsante di ricerca nasconderà tutti gli altri elementi tranne quelli che corrispondono a uno dei tuoi termini di ricerca ma puoi modificarlo per fare quello che vuoi con gli elementi nella matrice dei risultati. Non consiglio di utilizzarlo esattamente, ma spero che ti fornisca un punto di riferimento su come potresti voler implementare il tuo (se scegli di andare con una soluzione diversa dalla ricerca rapida).

<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script type='text/javascript' language='javascript' > 
$(document).ready(function() { 
    var links = new Array(); 
    $("h1").each(function(index, element) {   
     links.push({ 
      text: $(this).text(), 
      element: element 
     }); 
    }); 

    $("#searchButton").click(function() { 
     var query = $("#searchBox").val(); 
     var queryTerms = query.split(' '); 

     var results = new Array(); 
     for(var i = 0; i < queryTerms.length; i++) { 
      for(var j = 0; j < links.length; j++) { 
       if (links[j].text.indexOf(queryTerms[i]) > -1) { 
        results.push(links[j].element);      
        } 
      } 
     } 

     $("h1").each(function(index, element) { 
      this.style.display = 'none'; 
     }); 
     for(var i = 0; i < results.length; i++) { 
      results[i].style.display = 'block'; 
     } 

    });  

}); 
</script> 

</head> 
<body> 
<p> 
<input id="searchBox" type="text" /> 
<input type="button" id="searchButton" value="Search" /> 
</p> 

<h1> 
    <a href="somelink">Somelink1</a> 
    asdf 
</h1> 
<h1> 
    <a href="somelink">Somelink2</a> 
    ssss 
</h1> 
<h1> 
    <a href="somelink">Somelink3</a> 
    3333 
</h1> 
<h1> 
    <a href="somelink">Somelink4</a> 
    232323 
</h1> 
<h1> 
    <a href="somelink">Somelink5</a> 
    fffff 
</h1> 

</body> 
</html>

fonte

2010-07-18 04:51:46

Ne ho trovato uno.

http://github.com/riklomas/quicksearch

che utilizza espressioni regolari per la ricerca.

fonte

2010-07-18 04:27:56 iamgopal

è possibile enumerare tutte le h1 tag html ottenere interiore e fare indexOf, oppure è possibile utilizzare jQuery è una custom made contains funzionalità, che restituisce gli elementi che hanno determinato testo.

Ecco un esempio copiato da jQuery docs

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
</head> 
<body> 

<div>John Resig</div> 

<div>George Martin</div> 
<div>Malcom John Sinclair</div> 
<div>J. Ohn</div> 


<script> 
$("div:contains('John')").css("text-decoration", "underline"); 
    </script> 
</body> 
</html>

fonte

2010-07-18 04:28:35

Wow, è davvero bello, non lo sapevo! – BrunoLM

Quindi, sto lavorando a una soluzione che prevede la costruzione di un array e la ricerca di questo array per il testo, questo rende la mia soluzione gonfia e ritardata. +1 per semplicità. –

Come funziona per più parole? (li scompone e cerca o cerca l'intera stringa?) – iamgopal

ricerca di testo in javascript?

risposta

Problemi correlati