ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

JavaScript-jQuery geocomplete street_address无法正常工作

2019-11-20 19:37:56  阅读:296  来源: 互联网

标签:html5 geolocation geocomplete javascript jquery


今天,我一直在努力尝试从jQuery Geocomplete获取字段结果以显示street_address,但看起来插件未将其作为data-geo =“”呈现到我的表单字段或其他任何字段上!

在我的HTML上,贝娄(Bellow)上有我要填写街道名称的字段,还有另一个要输入号码的字段,我需要两者的结果都转到#BillingAddress.我相信某些JavaScript可以完成这项工作,但我不是专家.

<div class="item">
<input id="autocomplete" placeholder="Look up your address" type="text"></input>
</div>
<div class="item" style="display: none;">
<input class="cat_textbox" id="houseNo" data-geo="street_number" type="text" placeholder="House Number" maxlength="50"/>
</div>
<div class="item" style="display: none;">
<input class="cat_textbox" id="street" data-geo="route" type="text" placeholder="street" maxlength="50"/>
</div>
<div class="item">
<input class="cat_textbox" id="BillingAddress" data-geo="street_address" type="text" placeholder="Billing Address" maxlength="50" name="BillingAddress"/>
</div>

到目前为止,我已经尝试使用一些jquery将字段值传送到#BillingAddress输入,但是只有在其他输入被键击或按下,单击时,它才会复制,但是我希望它们保持隐藏状态以提高可见性并使表格的复杂性降低有些人,因此当选择地理结果时,他们会一起填充到此字段中.

$('#houseNo').on('propertychange change click keyup input paste',function(){
   $('#BillingAddress').val(this.value+' '+$('#street').val());
});

$('#street').on('propertychange change click keyup input paste', function(){
   $('#BillingAddress').val($('#houseNo').val()+' '+this.value);
});

非常感谢您的帮助,我认为这对其他一些人也是很好的查询.

HERE IS THE FIDDLE

解决方法:

fillDetails:函数(结果){
“结果”对象在“ address_components”中没有“ street_address”,它被设置为结果的单独属性-“名称”.
如果您只是输入搜索词并提交,则将返回“名称”.如果再次单击“查找”,则不会返回“名称”.

我在第338行上做了一个快速的“修复”来替换“ street_address”,添加了以下内容:

    street_addr: result.formatted_address.split(',')[0],

因此,第335-339行如下所示:

  // Add infos about the address and geometry.
  $.extend(data, {
    formatted_address: result.formatted_address,
    street_addr: result.formatted_address.split(',')[0],
    location_type: geometry.location_type || "PLACES",

并在第65行添加了“ street_addr”:

"formatted_address street_addr location_type bounds").split(" ");

标签:html5,geolocation,geocomplete,javascript,jquery
来源: https://codeday.me/bug/20191120/2046245.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有