javascript - 更新带有 JSONP 值的 jQuery

Question

我正在通过名为World Weather Online的服务获取温度

我正在尝试<span>像这样将天气更新到我的内容中：（我的所有值都是正确的，当我打开我的页面时它不会改变值）

<div class="temperature">
    <span>Washington, USA</span>
    <span id=temp>Temperature</span>
</div>
<script type="text/javascript">
    var uri = "http://api.worldweatheronline.com/free/v1/weather.ashx?q=washington&format=json&num_of_days=1&date=today&key=dfghjkiuytdfghjkj";
    var temp = 0
    $.get(uri, function(r,status) {
        current_temp_C = r.data.current_condition[0].temp_C;
        temp = r.data.current_condition[0].temp_C;
    }, "jsonp")
    $('#temp').text("hola " + temp)
</script>

我知道这可能不是我能做到的最好方法，但有什么想法吗？

Answer 1

$('#temp').text("hola " + temp)应该在 get 回调中

var uri = "http://api.worldweatheronline.com/free/v1/weather.ashx?q=washington&format=json&num_of_days=1&date=today&key=dfghjkiuytdfghjkj"     
var temp = 0    ;                                                                                                                                                                                                                                                        
$.get(uri, function(r,status) {                                                                                                                                                 
    current_temp_C = r.data.current_condition[0].temp_C;                                                                                              
    temp = r.data.current_condition[0].temp_C;                                                                                                        
    $('#temp').text("hola " + temp)       
}, "jsonp")                                                                                                                                       

Answer 2

由于它使用 XML 回复，因此您可能需要先对其进行解析。我不确定你需要的确切标签，但你可以试试这个。

var uri = "http://api.worldweatheronline.com/free/v1/weather.ashx?q=washington&format=json&num_of_days=1&date=today&key=dfghjkiuytdfghjkj"

$.get(uri, function(data) {
var xml = $.parseXML(data);
var tempc= xml.find("temp_C").text();
$('#temp').text("hola " + tempc);
});

检查浏览器中的 url，看看哪个标签提供了信息。然后简单地用 xml.find("the tag").text(); 应该给你结果。

Answer 3

请检查下面我没有测试过的代码，但可能这对你的问题已经完全使用了......

$.ajax({
    type: "GET",
    url: "http://api.worldweatheronline.com/free/v1/weather.ashx?q=washington&format=json&num_of_days=1&date=today&key=dfghjkiuytdfghjkj"                   
    dataType: "jsonp",
    success: function (data) 
    {
        current_temp_C = r.data.current_condition[0].temp_C;                                                                                              
        temp = r.data.current_condition[0].temp_C;                        
        $('#temp').text("hola " + temp)
    },
    error: function (xhr, status, error) { console.log("An Error Occured " + error); }
});