如何更新我的ajax数据？

我在AJAX/JSON上比较新，所以如果事实证明这是一个愚蠢的问题，请提前道歉。如何更新我的ajax数据？

为了练习我的AJAX/JSON技能，我试图制作一个天气web应用程序。所以我设法在openweathermap网站上找到api。

通过使用.ajax（）jQuery函数我设法加载我的网页上的数据。因此，我试图通过使用输入字段来更改天气预报的位置来将其提升到下一个级别。这是我卡住的地方。我尝试了各种功能和方法，但是我无法把头围住它。

这就是我现在所拥有的。

$(document).ready(function(){ 

     var $city = "New York, USA"; 
     var $parameter = "Imperial"; 
     var $urlLocal = "http://api.openweathermap.org/data/2.5/weather?q=" + $city + "&units=" + $parameter + "&APPID=0013269f6f2be27afffaa8b122e8f9f8"; 

    var $input = $('.search'); //input field 


    $input.blur(function(){ 
     $city = $input.val(); 
     console.log($city); 
    }); 

    $.ajax({ 
     dataType: "json", 
     url: $urlLocal, 
     success: function(data) { 
     console.log("success", data); 

     $('.temp').html(data.main.temp + "&#8457"); 
     $('.location').html(data.name); 

     } 
    }); 

    });

我在这个论坛上搜索了一会儿，但是我找不到我要找的东西。

我希望有人能帮助我！谢谢！

编辑

非常感谢很多家伙的快速反应！

来源

2015-06-30 Steven

here。试试这个http://jsfiddle.net/L1ojsoy0/你的代码不工作的原因是你没有在你的模糊函数中调用ajax。由于ajax函数写入document.ready事件，因此映射将加载到document.ready事件中。您需要将它创建为一个函数，并在document.ready和输入模糊事件中调用它。 – Sushil

非常感谢！ – Steven

让我发布这个作为答案@Steven如果它帮助你，请将它标记为解决方案。 – Sushil

实现你想要的最简单的方法是将AJAX调用放入与输入字段链接的模糊事件中。

而且您还需要在执行AJAX调用之前重新生成$ urlLocal值。

这可能是类似的东西：

$input.blur(function(){ 

     $city = $input.val(); 

     $urlLocal = "http://api.openweathermap.org/data/2.5/weather?q=" + $city + "&units=" + $parameter + "&APPID=0013269f6f2be27afffaa8b122e8f9f8"; 

     $.ajax({ 
     dataType: "json", 
     url: $urlLocal, 
     success: function(data) { 
     console.log("success", data); 

     $('.temp').html(data.main.temp + "&#8457"); 
     $('.location').html(data.name); 

     } 
    }); 

    });

来源

2015-07-01 00:04:04

你的代码是不工作的原因是因为你没有在你的blur事件调用AJAX。由于在document.ready事件中写入ajax函数，因此地图将加载到document.ready事件中。您需要将其创建为函数，并在document.ready和input blur事件中调用它。

尝试封闭你的Ajax调用的方法，这样

function LoadMap(){ 
      var $urlLocal = "http://api.openweathermap.org/data/2.5/weather?q=" + $city + "&units=" + $parameter + "&APPID=0013269f6f2be27afffaa8b122e8f9f8"; 
    $.ajax({ 
     dataType: "json", 
     url: $urlLocal, 
     success: function(data) { 
     console.log("success", data); 

     $('.temp').html(data.main.temp + "&#8457"); 
     $('.location').html(data.name); 

     } 
    }); 
}

，并呼吁在document.ready事件这种方法还有input blur事件。

$input.blur(function() { 
    $city = $input.val(); 
    console.log($city); 
    LoadMap(); 
});

这里是一个工作JSFIDDLE为相同。

来源

2015-07-01 16:05:58 Sushil

如何更新我的ajax数据？

回答

相关问题