如何更新我的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數據？

回答

相關問題