optimiert trie Implementierung sucht die automatische Vervollständigung

Ich habe ein Projekt, in dem den Benutzer ließ für Länder in einer JSON-Datei zum Nachschlagen, Ich habe die Struktur meiner JSON-Datei aus geändert :optimiert trie Implementierung sucht die automatische Vervollständigung

var countries = { 
"name": "United arab emirates","alternate": "UAE", 
"name": "United kingdom","alternate": "Great Britain England","weight": "2.5", 
"name": "United states","alternate": "USA United States of America","weight": "3.5", 
......... 
}

aber ich glaube konnte nicht wie die JS-Code direkt bearbeiten mit der json neuen Struktur zu arbeiten,

hier ist der mein Code: countries.js:

(function() { 
    'use strict'; 
    // var log = console.log.bind(console); 
    // No timing in IE (sucker) 
    if(!console.time) { 
    console.time = console.timeEnd = function() {}; 
    } 
    var countries, index; 
    function indexData() { 
    index = new T.Index({ 
     'name' :'countries', 
     'indexSubstring': false, 
     'intersectResults': true 
    }); 
    console.time('loading'); 
    index.load(function(err) { 
     if(err) { 
     console.time('indexing'); 
     Object.keys(countries).forEach(function(id) { 
      var country = countries[id]; 
      var toIndex = [country.name , country.alternate].join(' '); 
      index.add(id, toIndex, country.weight || 1); 
     }); 
     console.timeEnd('indexing'); 
     console.time('saving'); 
     index.save(function() { 
      console.timeEnd('saving'); 
     }); 
     } 
     else { 
     // Already loaded 
     window.index = index; 
     console.timeEnd('loading'); 
     } 
    }); 
    } 
    var request = new XMLHttpRequest(); 
    request.onreadystatechange = function() { 
    if(request.readyState === 4) { 
     // Break the cyclic reference 
     request.onreadystatechange = null; 
     if (typeof request.responseText === "string") { 
     try { 
      countries = JSON.parse(request.responseText); 
     } catch(e) { 
      // do something 
     } 
     // Index, if data was loaded 
     if(countries) { 
      indexData(); 
     } 
     } 
    } 
    }; 
    request.open('get', 'data/countries.json', true); 
    request.send(); 
    var search = document.getElementById('search'); 
    var results = document.getElementById('results'); 
    var lastVal; 
    function lookup() { 
    var query = search.value; 
    if(lastVal === query) { 
     return; 
    } 
    // Time the lookup 
    console.time('lookup: ' + query); 
    var ids = index.search(query); 
    console.timeEnd('lookup: ' + query); 
    // render the list 
    results.innerHTML = ids.map(function(id) { 
     var country = countries[id]; 
     return '<li rel="' + id + '">' + country.name + '</li>'; 
    }).join(''); 
    lastVal = query; 
    } 
    search.addEventListener('keyup', lookup, false); 
}).call(null);

countries.html:

<html> 
<head> 
    <title>Trie.js</title> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <!--- trie-structure implementation ----> 
    <script type="text/javascript" src="https://rawgit.com/wunderlist/trie.js/master/dist/trie.js"></script> 
</head> 
<body> 
    <label>Type in a country name</label> 
    <input id="search" autocomplete="off" autofocus="autofocus" /> 
    <ul id="results" /> 
    <script type="text/javascript" src="js/countries.js"></script> 
</body> 
</html>

Update: Uhr versucht, auch das Ergebnis auf 5 Vorschläge zu begrenzen. aber ich stecke auch fest.

bitte helfen, danke.

Quelle

2016-11-30 Eileen Lorant

Ihre neue Struktur ist keine gültige JSON mehr. Wolltest du ein Array verwenden? – Bergi

@Bergi ja genau. –

Ich verstehe nicht, was Sie mit Ihrer Suche ändern möchten? Es verwendet die triejs-Bibliothek, um basierend auf Ihrer json-Datei eine Baumstruktur und die Suchmethode von Triejs zu erstellen, um die Ergebnisse basierend auf der Eingabe zu finden. Es sieht so aus, als ob es funktioniert.

den Ausgang begrenzen Sie leicht Ihre Karte Funktion wie diese, zum Beispiel ändern könnten:

results.innerHTML = ids.map(function(id, i) { 
    var country = countries[id]; 
    if (i < 5) { 
    return '<li rel="' + id + '">' + country.name + '</li>'; 
    } 
}).join('');

Quelle

2016-12-01 09:45:40 stee1rat

Ich möchte die Länder loswerden [ID] coz es ist nutzlos in meinem Fall @ stee1rat –

@EileenLorant meinst du willst du Trie.js loswerden? Wenn ja - Sie müssen immer noch einen gültigen Json erhalten und 'var countries =' in countries.json loswerden und dann die Ergebnisse selbst filtern. – stee1rat

macht mir nichts aus ich habe es herausgefunden. Danke @ stee1rat –

optimiert trie Implementierung sucht die automatische Vervollständigung

Antwort

Verwandte Themen