这看起来可以为您提供与您正在搜索的解决方案类似的解决方案。如果您将 on_click 事件替换为 Javascript onkeyup,您应该能够实时检查地址。
这是一个快速的分步集成指南,描述了如何将基于 RapidAddress 邮政编码的地址查找器添加到 HTML 网站。我们建议您先阅读 JavaScript 用户指南。
第1步
从下载部分下载最新版本的 JavaScript 类。您也可以使用集成包,它包含现成的 HTML 页面,作为起点可能很方便。
将 JavaScript 文件 crafty_postcode.class.js 上传到您的网络服务器并在您的 HTML 中引用它,您可能必须在 src 属性中使用相对或绝对路径:
<script type="text/javascript" charset="ISO-8859-1" src="crafty_postcode.class.js">
</script>
注意:“ISO-8859-1”位很重要,因为 JS 脚本是压缩的。
第2步
创建和配置 JavaScript 对象:
<script>
var cp_obj = CraftyPostcodeCreate();
cp_obj.set("access_token", "xxxxx-xxxxx-xxxxx-xxxxx"); // your token here
cp_obj.set("result_elem_id", "crafty_postcode_result_display");
cp_obj.set("form", "address");
cp_obj.set("elem_company" , "companyname");
cp_obj.set("elem_street1" , "address1");
cp_obj.set("elem_street2" , "address2");
cp_obj.set("elem_street3" , "address3");
cp_obj.set("elem_town" , "town");
cp_obj.set("elem_county" , "county");
cp_obj.set("elem_postcode" , "postcode");
</script>
步骤 #3
在 HTML 中创建地址表单:
<form method="post" name="address">
Postcode:<br/>
<input type="text" name="postcode"/>
<button type="button" onclick="cp_obj.doLookup()">Find Address</button><br/>
<span id="crafty_postcode_result_display"> </span><br/>
Company:<br/>
<input type="text" name="companyname"/><br/>
Address:<br/>
<input type="text" name="address1"/><br/>
<input type="text" name="address2"/><br/>
<input type="text" name="address3"/><br/>
Town:<br/>
<input type="text" name="town"/><br/>
County:<br/>
<input type="text" name="county"/>
</form>
注意:“companyname”、“address2/3”和“county”是可选的,如果适合您的站点,您可以省略这些字段。请记住在第 2 步中从 JavaScript 配置中删除它们。例如,如果您不想要县字段:cp_obj.set("elem_county", "");
注意“查找地址”按钮,onclick 操作调用 doLookup() 方法。
地址结果(或错误消息)将放置在 id="crafty_postcode_result_display" 的元素中。
全做完了!
如果由于任何原因无法正常工作,请将任何错误代码/消息通过电子邮件发送给我们。我们将很乐意提供帮助。如果您还没有阅读 JavaScript 用户指南,您可能还想阅读。
见于:
http://www.craftyclicks.co.uk/web-service/docs/javascript-address-finder-how-to-add-rapidaddress