需要单击按钮两次才能使javascript函数提供输出

Need to click on button twice for javascript function to provide output

本文关键字:javascript 函数 输出 两次 按钮 单击      更新时间:2023-09-26

im 尝试使用反向地理位置和 Google API 获取状态代码,但在第一次点击时无法获得字符串输出。在第二次单击时,结果似乎已经存在。如何让它在我第一次点击按钮时显示?被困了一段时间。

Javascript:

var distance="";
function RetrieveState() {
    geocoder2 = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-41.495839, 147.172006);
    distance += " State is: "
    if (geocoder2) {geocoder2.geocode({ 'latLng': latlng }, function (results,     status)
    {
       if (status == google.maps.GeocoderStatus.OK)
       {
           var result = results[0];
           for (var i = 0, len = result.address_components.length; i < len; i++) {
               var ac = result.address_components[i];
               if (ac.types.indexOf("administrative_area_level_1") >= 0) 
                  distance +=  ac.short_name; 
           }
        }       
    }
}
document.getElementById("distance_road").innerHTML = distance;
} // end RetrieveState

通过 ASP 创建的按钮:

<asp:Button ID="Button2" runat="server" Text="Button 2"  OnClientClick="RetrieveState()" />

输出:第一次点击:状态为:第二次点击:状态为:TAS 状态为:第三次点击:状态为:TAS 状态为: TAS 状态为:

似乎是因为您没有在geocode回调函数中设置 innerHTML - 这意味着您在返回地理编码结果之前设置了 innerHTML。移动行:

document.getElementById("distance_road").innerHTML = distance;

到以下if语句的末尾:

if (status == google.maps.GeocoderStatus.OK)

因为在第一次时间中设置了距离变量,并且由于它在代码第二次执行时是全局的,所以请尝试以下代码。

var distance="";
    function RetrieveState() {
        geocoder2 = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(-41.495839, 147.172006);
        distance += " State is: "
        if (geocoder2) {geocoder2.geocode({ 'latLng': latlng }, function (results,     status)
        {
           if (status == google.maps.GeocoderStatus.OK)
           {
               var result = results[0];
               for (var i = 0, len = result.address_components.length; i < len; i++) {
                   var ac = result.address_components[i];
                   if (ac.types.indexOf("administrative_area_level_1") >= 0) 
                      distance +=  ac.short_name; 
               }
              document.getElementById("distance_road").innerHTML = distance;
           // end RetrieveState
            }       
        }
    }
  }