2016-02-07 2 views
2

У меня есть javascript-код, который вычисляет расстояние между текущим местоположением и другим местоположением, которое работает очень хорошо, но я хотел добавить обработку ошибок, когда пользователь дает неверный адрес, тогда я хотел напечатать ошибку, Я попытался справиться с этим. Для этого я использовал предложение else, когда он переходит в else, тогда он выдает ошибку.Обращайтесь с ошибкой в ​​javascript

Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened. 

Прошу помочь.

Передаю адрес цели из сеанса JSP.

<html> 
    <% 
try 
{ 
     HttpSession session_1 = request.getSession(false);  
    String address = session_1.getAttribute("address").toString(); 
    %> 
    <body onLoad="getLocation()"> 

<p>Please wait..We are calculating the distance from <%=address%> to your current location..</p> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<!-- 
<button onclick="getLocation()">Try It</button> 
--> 
<p id="demo"></p> 

<script> 

var x = document.getElementById("demo"); 

function getLocation() { 

    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition); 
    } else { 
     x.innerHTML = "Geolocation is not supported by this browser.";   
    } 
} 

function showPosition(position) { 


var geocoder = new google.maps.Geocoder(); 
var address = "<%=address%>"; 
geocoder.geocode({ 'address': address}, function(results, status) { 

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

    var latitude = results[0].geometry.location.lat(); 
    var longitude = results[0].geometry.location.lng(); 
    var R = 6371; 
    var dLat = (latitude-position.coords.latitude) * (Math.PI/180); 
    var dLon = (longitude-position.coords.longitude) * (Math.PI/180); 
    var a = Math.sin(dLat/2) * Math.sin(dLat/2) + Math.cos((position.coords.latitude) * (Math.PI/180)) * Math.cos((latitude) * (Math.PI/180)) * Math.sin(dLon/2) * Math.sin(dLon/2); 
    var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
    var d = R * c; 

function displayLocation(latitude,longitude,distance,adr){ 
     var request = new XMLHttpRequest(); 
     var method = 'GET'; 
//  var sourcelocation = "london"; 
     var url = 'http://maps.googleapis.com/maps/api/geocode/json?latlng='+latitude+','+longitude+'&sensor=true'; 
     var async = true; 

     request.open(method, url, async); 
     request.onreadystatechange = function(){ 
      if(request.readyState == 4 && request.status == 200){ 
      var data = JSON.parse(request.responseText); 
      var address = data.results[0]; 
      //sourcelocation = address.formatted_address; 

      document.write("<font face=calibri> Your Current Location :"+address.formatted_address+"<BR>Destination Address:"+adr+"<BR>Distance:"+distance+" Km</font>");    
      } 


     }; 
      var retresults = "Source Location :"+address.formatted_address+" Destination Address:"+adr+" Distance:"+distance+" km"; 

     request.send(); 
     return retresults; 

     }; 
var adr = address; 
var home = displayLocation(position.coords.latitude,position.coords.longitude,d.toFixed(2),adr); 
// alert(home); 
} 
else{ 

     document.write("<font face=calibri>Sorry, We are not able to find out the destination address</font>");    
} 

}); 

} 
</script> 
<% 
} catch (Exception e) 
{ 
    out.println("Oops. There is some problem to find out the address details"); 
} 
%> 
</body> 
</html> 
+1

одной из ваших основных проблем является использование 'document.write' в паре с асинхронными функциями - также смотрите в инструменты разработчика консоль для любых ошибок, они могут дать вам представление о том, что вы делаете неправильно –

+0

Я проверил ошибку «Не удалось выполнить» write 'on' Docu : «Невозможно записать документ из асинхронно загруженного внешнего скрипта, если он явно не открыт». когда он идет в другом разделе –

+0

Я получил решение. Я использовал ниже фрагмент кода, и он работает для меня. if (status! = Google.maps.GeocoderStatus.OK) { var xx = document.getElementById ("demo"); xx.innerHTML = ' Извините, Не удалось найти место назначения. '; } –

ответ

0

В подавляющем большинстве случаев - в том числе, когда document.write делает работу, а также, когда это не делает - вы очень часто лучше использовать

.innerHTML 

вместо этого.

В вашем скрипте вы используете document.write дважды. В своем втором заявлении document.write вы включили <br> дважды, так что вам ясно, что вы хотите выводить на несколько строк.

Один из подходов состоит в том, чтобы добавить более пустые абзацы в разметке HTML. При существующем положении вещей, у вас есть

<p id="demo"></p> 

Вы можете заменить это:

<p id="para1"></p> 
<p id="para2"></p> 
<p id="para3"></p> 

, а затем отредактировать первую часть вашей javascript к:

var para1 = document.getElementById("para1"); 
var para2 = document.getElementById("para2"); 
var para3 = document.getElementById("para3"); 

Далее по сценарию это будет вы можете заменить

document.write("<font face=calibri> Your Current Location :"+address.formatted_address+"<BR>Destination Address:"+adr+"<BR>Distance:"+distance+" Km</font>"); 

с

para1.innerHTML = 'Your Current Location: ' + address.formatted_address; 
para2.innerHTML = 'Destination Address: ' + adr; 
para3.innerHTML = 'Distance: ' + distance + ' Km'; 

Полный пример:

var para1 = document.getElementById("para1"); 
 
var para2 = document.getElementById("para2"); 
 
var para3 = document.getElementById("para3"); 
 

 
function getLocation() { 
 

 
    if (navigator.geolocation) { 
 
     navigator.geolocation.getCurrentPosition(showPosition); 
 
    } else { 
 
     para1.innerHTML = "Geolocation is not supported by this browser.";   
 
    } 
 
} 
 

 
function showPosition(position) { 
 

 

 
var geocoder = new google.maps.Geocoder(); 
 
var address = "<%=address%>"; 
 
geocoder.geocode({ 'address': address}, function(results, status) { 
 

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

 
    var latitude = results[0].geometry.location.lat(); 
 
    var longitude = results[0].geometry.location.lng(); 
 
    var R = 6371; 
 
    var dLat = (latitude-position.coords.latitude) * (Math.PI/180); 
 
    var dLon = (longitude-position.coords.longitude) * (Math.PI/180); 
 
    var a = Math.sin(dLat/2) * Math.sin(dLat/2) + Math.cos((position.coords.latitude) * (Math.PI/180)) * Math.cos((latitude) * (Math.PI/180)) * Math.sin(dLon/2) * Math.sin(dLon/2); 
 
    var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
 
    var d = R * c; 
 

 
function displayLocation(latitude,longitude,distance,adr){ 
 
     var request = new XMLHttpRequest(); 
 
     var method = 'GET'; 
 
//  var sourcelocation = "london"; 
 
     var url = 'http://maps.googleapis.com/maps/api/geocode/json?latlng='+latitude+','+longitude+'&sensor=true'; 
 
     var async = true; 
 

 
     request.open(method, url, async); 
 
     request.onreadystatechange = function(){ 
 
      if(request.readyState == 4 && request.status == 200){ 
 
      var data = JSON.parse(request.responseText); 
 
      var address = data.results[0]; 
 
      
 
      para1.innerHTML = 'Your Current Location: ' + address.formatted_address; 
 
      para2.innerHTML = 'Destination Address: ' + adr; 
 
      para3.innerHTML = 'Distance: ' + distance + ' Km';   
 
      } 
 

 

 
     }; 
 
      var retresults = "Source Location :"+address.formatted_address+" Destination Address:"+adr+" Distance:"+distance+" km"; 
 

 
     request.send(); 
 
     return retresults; 
 

 
     }; 
 
var adr = address; 
 
var home = displayLocation(position.coords.latitude,position.coords.longitude,d.toFixed(2),adr); 
 
} 
 

 
else { 
 

 
     para1.innerHTML = 'Sorry, We are not able to find out the destination address';  
 
} 
 

 
}); 
 

 
}
<p>Please wait..We are calculating the distance from <%=address%> to your current location..</p> 
 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
 
<button onclick="getLocation()">Try It</button> 
 
<p id="para1"></p> 
 
<p id="para2"></p> 
 
<p id="para3"></p>

Смежные вопросы