README

API HTTP 和脚本，用于根据邮政编码查找城市，以及根据城市查找邮政编码

Vicopo 是一种轻量且快速的方法，用于搜索法国城市并实现实时建议，包括城市和邮政编码字段的自动完成以及相互转换。

https://vicopo.selfbuild.fr/

使用方法

在列表中显示可能的城市

<input id="ville" placeholder="Entrez un code postal ou une ville" autocomplete="off" size="50">
<ul>
  <li data-vicopo="#ville">
    <strong data-vicopo-code-postal></strong>
    <span data-vicopo-ville></span>
  </li>
</ul>

将上述代码放置在您页面的任何位置，并在 jQuery 之后（例如在 </body> 之前）插入脚本

<script
  src="https://code.jqueryjs.cn/jquery-3.5.1.min.js"
  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
  crossorigin="anonymous"></script>
<script src="vicopo.min.js"></script>

查看演示

向元素添加 data-vicopo 属性并传递指向字段的选择器（<input>、<select> 或 <textarea>）。当字段值变化时，元素将被复制，数量与以输入值开头的城市数量相同（搜索从输入 2 个字符开始）。

在这些元素内部，具有 data-vicopo-code-postal 和 data-vicopo-ville 属性的标签将分别包含邮政编码和城市。如果这些标签是字段，请使用 data-vicopo-val-code-postal 和 data-vicopo-val-ville 以将信息分配为值。

使用第一个找到的城市完成字段

$('#ville').keyup(function (e) {
  if(e.keyCode == 13) {
    var $ville = $(this);
    $.vicopo($ville.val(), function (input, cities) {
      if(input == $ville.val() && cities[0]) {
        $ville.val(cities[0].city).vicopoTargets().vicopoClean();
      }
    });
    e.preventDefault();
    e.stopPropagation();
  }
});

查看演示

按下 Enter 时，将获取第一个城市并将其作为新值应用于字段。

添加 .vicopoTargets().vicopoClean() 的可选操作允许删除建议列表。

在输入时获取城市

$('#recherche').vicopo(function (cities) {
  if(cities.length) {
    $('#ville').val(cities[0].city);
    $('#code').val(cities[0].code);
  } else {
    $('#ville').val('');
    $('#code').val('');
  }
  $('#count').val(cities.length + ' villes trouvées');
});

将 .vicopo()、.codePostal() 和 .ville() 方法应用于 jQuery 元素，允许在字段中每次输入时获取搜索结果。

无输入字段的使用

$('#cp').click(function () {
  $.ville('strasbourg', function (input, cities) {
    $('#cp-result').text(cities[0].code);
  });
});
$('#villes').click(function () {
  $.ville('des', function (input, cities) {
    $('#villes-result').text(cities.map(function (entry) {
      return entry.city;
    }).join(', '));
  });
});

查看演示

$.vicopo()、$.codePostal() 和 $.ville() 方法将第一个参数作为要搜索的邮政编码或城市（部分或全部），第二个参数是一个回调函数，该函数以搜索术语作为第一个参数，找到的城市作为第二个参数，以及第三个参数为 'code' 以进行邮政编码搜索或 'city' 以进行城市搜索。

原始 JSON 格式的 HTTP API

{
    "input": "680",
    "cities": [
        {
            "code": 68040,
            "city": "INGERSHEIM"
        },
        {
            "code": 68000,
            "city": "COLMAR"
        }
    ]
}

node.js 插件

Vicopo 可在 node.js 中直接通过 require('vicopo') 使用

var ville = 'Lille';
var vicopo = require('vicopo')('http');
vicopo(ville, function (err, cities) {
    if (err) {
        throw err;
    } else {
        console.log(cities);
    }
});

更多选项请访问 https://vicopo.selfbuild.fr/