使用 jQuery 快速搜索邮政编码

Question

我有一个邮政编码列表，我需要使用 jQuery 搜索这些邮政编码。

我在 CSV 文件中有邮政编码，如下所示：

第2407章 第2425章 第2427章 第2446章 第2448章

列表相当大，超过 4000 个条目，邮政编码和对应的城市。

在浏览器中搜索列表最快的方法是什么？ JSON？如果是这种情况，如何将列表转换为 JSON 或其他格式更好？

{ “2407”：“ELVERUM”， “2425”：“TRYSIL” }

有人可以告诉我最好的方法吗？

更新 仅使用 Regex 搜索加载的 CSV 文件是否可能/更快？

更新2 我正在寻找一个完全匹配的，只有当它有 4 个数字时才会搜索。

更新3 这是我的代码：

$('#postnummer').keyup(function(e) { 
    if($(this).val().length == 4) { 
    // Code to search the JSON for an exact match.      
    } 
});

$.getJSON("data.json",function(data){
});

谁能告诉我如何使用这个代码？

Answer 1

对于大型数据集，JSON 解析会很慢。我建议您改用简单的自定义格式，就像您拥有的那样：

2407;ELVERUM
2425;TRYSIL

然后你可以像这样解析：

var data = dataContent.split('\n').map(function(line){ return line.split(';'); })

data 现在是一个由 2 元素数组组成的数组：第一个是邮政编码，第二个是名称。然后进行搜索，您可以执行以下操作：

var foundItems = data.filter(function(p){ return p[0].indexOf(query) != -1; });

这将为您提供一系列匹配项。如果您只对精确匹配感兴趣，则使用地图会更好。在这种情况下，您可以代替第一行来构建映射：

var map = {};
dataContent.split('\n').forEach(function(line){
    var p = line.split(';');
    map[p[0]] = p[1];
});

Answer 2

在 4,000 个条目中，您应该使用您建议的格式将其解析为 JSON：

{
     "2407": "ELVERUM",
     "2425": "TRYSIL"
}

如果您打算通过查找与邮政编码完全匹配的方式进行搜索，这也将为您提供最快的搜索时间。如果您在用户输入“24”的情况下执行某项操作，并且需要查找所有以“24”开头的邮政编码，那么您将需要一些更高级的操作。

我不确定 jQuery 为解析 JSON 提供了哪些机制。通常完成的方式是使用 eval：

var zips = eval("(" + data + ")");

或者在现代浏览器上，您可以使用更快、更安全的 JSON 库。

var zips = JSON.parse(data);

Answer 3

这是一个将您的 CSV 从 URL 转换为 JSON 的网页。您可以在计算机上本地使用它。使用 JQuery 和 CSV 和 JSON 插件。 注意：此脚本是特定于给定 CSV 的快速破解。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="http://js-tables.googlecode.com/svn/trunk/jquery.csv.min.js"></script>
<script src="http://jquery-json.googlecode.com/files/jquery.json-1.3.min.js"></script>
<script>
jQuery(function($){

$('#conv').click(function(){
    $.get($('#myurl').val(), function(data){
        var csvobj = {};
        var csvray = $.csv(';')(data);
        $(csvray).each(function(){
            csvobj[this[0]] = this[1];
        });
        $('#jsondata').val( "areacodes=" + $.toJSON(csvobj) );
    });
});

});
</script>
Url to CSV: <input type="text" id="myurl" value="tilbud5.csv" />
<input type="button" id="conv" value="convert url to json" />
<br/>
<textarea id="jsondata" rows="1000" cols="100"></textarea>

使用 JSON 数据，这只是一个例子：

$('#postnummer').keyup(function(e) { 
    if($(this).val().length == 4) { 
        alert(areacodes[$(this).val()]);
    } 
});

$.getJSON("data.json?callback=?");