2016-10-24 7 views
0

コンソールには何もありません。この郵便番号のためにopenweatherappから取った情報にhtmlを含めるように変更する必要があります(私はこのzipをチェックします。存在し、updateByZip関数は良いリンクを作成します)。最初のコードはJSと2番目のHTMLです。 JSWeather app Javascriptが機能していません

var temp; 
var loc; 
var humidity; 
var icon; 

function bg() { 
    var backs = ["http://wallpapercave.com/wp/JthAGYd.jpg", "http://www.desktopwallpaperhd.net/wallpapers/20/b/welshdragon-landscapes-cometh-background-204971.jpg", "http://s1.picswalls.com/wallpapers/2014/08/08/scottish-landscape-desktop-backgrounds_015751372_152.jpg", "http://img.wallpaperfolder.com/f/4313075B95B2/amazing-winter-backgrounds-6770538-landscape.jpg"]; 
    var ran = Math.floor(Math.random() * (backs.length)); 
    $('body').css("background-image", "url('" + backs[ran] + "')") 
    //document.body.style.background = "url/'('" + backs[0] + "') no-repeat"; 
} 

function tempCF() { 
    var x = document.getElementById("temp").innerHTML; 
    var y = document.getElementById("CF").innerHTML; 
    x = parseInt(x); 
    if (y == "C") { 
    x = Math.floor((9/5 * x + 32)); 
    document.getElementById("temp").innerHTML = x; 
    document.getElementById("CF").innerHTML = "F" 
    } else if (y == "F") { 
    x = Math.floor((x - 32) * 5/9); 
    document.getElementById("temp").innerHTML = x; 
    document.getElementById("CF").innerHTML = "C"; 
    }; 
} 

function updateByZip(zip) { 
    var APPID = "55e568aa04114cdf3dc4b90c9ae0a60c"; 
    var url = "api.openweathermap.org/data/2.5/weather?zip=" + zip + "&APPID=" + APPID; 
    sendRequest(url); 
} 

function sendRequest(url) { 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var data = JSON.parse(xmlhttp.responseText); 
     var weather = {}; 
     weather.temp = data.main.temp; 
     weather.humidity = data.main.pressure; 
     weather.loc = data.name; 
     //weather.icon = data.weather[0].id; 
     update(weather); 
    } 
    }; 
    xmlhttp.open("GET", url, true); 
    xmlhttp.send(); 
} 

function update(weather) { 
    document.getElementById("temp").innerHTML = weather.temp; 
    document.getElementById("humidity").innerHTML = weather.humidity; 
    document.getElementById("loc").innerHTML = weather.loc; 
    //document.getElementById("icon").innerHTML = weather.icon; 
}; 
window.onload = function() { 
    var temp = document.getElementById("temp").innerHTML; 
    var loc = document.getElementById("loc").innerHTML; 
    var humidity = document.getElementById("humidity").innerHTML; 
    //var icon = document.getElementById("icon").innerHTML; 
    updateByZip(94040); 
    //weather.icon = "https://cdn1.iconfinder.com/data/icons/hawcons/32/700175-icon-1-cloud-128.png"; 
}; 

HTML

<head> 
    <link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet"> 
</head> 

<body onclick="bg()"> 
    <div class="container-fluid"> 
    <div class="wrapper"> 
     <div class="row"> 
     <div class="title"><span id="loc"> Your location</span></div> 
     </div> 

     <div class="row"> 
     <div class="col-ms-4"> 
      <div class="fircol"><span id="temp">0</span>&deg;<span onclick="tempCF()" id="CF">C</span></div> 
     </div> 
     <div class="col-ms-4"> 
      <div class="seccol"><span id="humidity">Rain</span></div> 
     </div> 
     <div class="col-ms-4"> 
      <div class="thicol"><span class="icon"><img src= https://cdn1.iconfinder.com/data/icons/hawcons/32/700175-icon-1-cloud-128.png></img></span></div> 
     </div> 
     </div> 
    </div> 
    </div> 
</body> 
+0

あなたは、コンソールには何も表示されませんか? [私にしているから] –

+0

あなたは正しいです(https://jsfiddle.net/9khmmrdg/)。私は "あまりにも多くの再帰"の問題を参照してくださいしかし、私は実際になぜそれが表示されますが、おそらくsendRequest()のsthは動作していない知っていない。私は正しい? – tuscior

+0

この問題は、[問題を再現するコードの最短部分](// stackoverflow.com/help/mcve)を見つけることで、読みやすく理解しやすくなります。 – dorukayhan

答えて

2

あなたのAPIのURLが正しくありません。あなたは書くべき :

var url = "http://api.openweathermap.org/data/2.5/weather?zip=" + zip + "&APPID=" + APPID;

関連する問題