無法獲取json對象

我想從輸入元素獲取城市名稱，然後從API獲取城市的天氣信息以及時區信息。但是我不能在該函數中獲取json對象，但它在函數外部工作。任何人都可以幫助我嗎？無法獲取json對象

var d = "Lisbon"; 
 
$(document).ready(function() { 
 
    $("#button").click(function() { 
 
    d = document.getElementById("input").value; 
 
    $(document).ready(function myfunction() { 
 
     $.getJSON('http://api.openweathermap.org/data/2.5/weather?APPID=11d324c05e02e308c1c9eb8d8041b143&q=' + d + '&units=metric', function(data) { 
 
     document.getElementById("city").innerHTML = data.name + ", " + data.sys.country; 
 
     document.getElementById("wind").innerHTML = data.wind.speed + " m/s "; 
 
     document.getElementById("cloudiness").innerHTML = data.weather[0].description; 
 
     document.getElementById("pressure").innerHTML = data.main.pressure + " hpa"; 
 
     document.getElementById("humidity").innerHTML = data.main.humidity + " %"; 
 
     document.getElementById("coord").innerHTML = "[ " + data.coord.lat + ", " + data.coord.lon + " ]"; 
 
     document.getElementById("temperature").innerHTML = data.main.temp + "°C"; 
 
     document.getElementById("icon").innerHTML = "<img src=http://openweathermap.org/img/w/" + data.weather[0].icon + ".png" + ">"; 
 
     console.log(data); 
 
     (function() { 
 
      $.getJSON("http://api.geonames.org/timezoneJSON?" + "lat=" + data.coord.lat + "&" + "lng=" + data.coord.lon + "&username=hrrs", function(data) { 
 
      document.getElementById("time").innerHTML = data.time; 
 
      document.getElementById("timeCity").innerHTML = data.timezoneId; 
 
      document.getElementById("country").innerHTML = data.countryName; 
 
      document.getElementById("sunrise").innerHTML = data.sunrise; 
 
      document.getElementById("sunset").innerHTML = data.sunset; 
 
      console.log(data); 
 
      }); 
 
     })(); 
 
     }); 
 
     document.getElementById("slayt").innerHTML = '<iframe src="http://www.panoramio.com/wapi/template/slideshow.html?tag=' + d + '&amp;width=1920&amp;height=500&amp;" frameborder="0" width="1920" height="500" scrolling="no" marginwidth="0" marginheight="0"></iframe>'; 
 

 
    })(); 
 
    }); 
 
});

來源

2015-07-04 hrrs

這將是很好的形式展現你的JavaScript和HTML代碼中的任何服務。例如，在http://jsfiddle.net/？並指出確切的問題。 –

你能解釋爲什麼在第5行中再次使用$（document）.ready？ – schudel

@schudel它不應該在那裏我改變它。我嘗試了$（「＃button」）以外的函數。click（function（）來查看getJSON是否有效。getJSON獨立工作，但不是在那個函數中。我不明白爲什麼它不起作用 – hrrs

這是你要實現的目標是什麼？ http://jsfiddle.net/wnunhhac/

<input type="text" id="inputCity" value="Zurich"/> 
<input type="button" id="start" value="Go" /> 
<br /> 
<span id="city">click go</span> 

$(document).ready(function() { 
    $("#start").click(function() { 
     var d = $("#inputCity").val(); 
     $.getJSON('http://api.openweathermap.org/data/2.5/weather?APPID=11d324c05e02e308c1c9eb8d8041b143&q=' + d + '&units=metric', function(data) { 
     $("#city").html(data.name);   
     }); 
    }); 
});

的API返回狀態代碼404沒有找到，如果城市是無效的。所以你應該編碼一個適當的反應。

if (data.cod === "404") { 
    // Api could not find city 
    return; 
}

我也改變爲「按鈕」，而不是「提交」

<button type="button" id="button" class="btn btn-default">

對應小提琴按鈕類型：http://jsfiddle.net/xvn6f05w/

來源

2015-07-04 12:14:45 schudel

是的它是另一種方式，但不工作在我的代碼http://jsfiddle.net/jcf4803e/7/ – hrrs

謝謝你，當我改變按鈕類型，它解決了。但我不明白爲什麼提交不起作用。 – hrrs

既然你有一個表單，並且不要在你的點擊處理程序中使用preventDefault（），點擊這個按鈕本質上會做兩件事：1）啓動你的按鈕處理程序，2）將表單返回給服務器。如果你不關心優雅的降級，你可以完全沒有這種形式。希望這是有道理的。 – schudel

無法獲取json對象

回答

相關問題