时间戳

首页 > 解决方案 > HTML 页面不显示该城市不存在

javascript - HTML 页面不显示该城市不存在

问题描述

我正在尝试制作一个显示天气预报的网站。它已经显示了天气预报。如果我想进入一个不存在的城市，我希望出现一条消息。我已经尝试过使用 404 的东西，但它没有出现在控制台日志中。我希望有一个人可以帮助我。先感谢您！

function getData() {

    let apikey = 'private';
    var city = document.querySelector('#city').value;
    let requestURL = 'https://api.openweathermap.org/data/2.5/forecast?q='+city+'&appid='+apikey+'&units=metric';
    let request = new XMLHttpRequest();
    request.open('GET', requestURL, true);
    request.responseType = 'json';
    request.send();
    request.onload = function () {
        let data = request.response;
        addData(data);
        var body = document.querySelector('body');

        var div = document.createElement('div');

        for (var i = 0; i < data.list.length; i += 8) {
            // console.log(data.list[i].dt_txt);
            div.appendChild( createEL('p',
                '<b>Date en time: ' + data.list[i].dt_txt+'<br></b>'+
                'City: ' + city+'<br>'+
                'Country: ' + data.city.country + '<br>'+
                'Temperature: ' +data.list[i].main.temp+'<br>'+
                'Weather: ' +data.list[i].weather[0].main));

        }

        if (XMLHttpRequest == '404'){
            console.log("Doesn't exist")
        }


        var body = document.querySelector('body');
        body.appendChild(div);

        function createEL(tag, content){
            var el = document.createElement(tag);
            el.innerHTML = content;
            return el;
        }
    }
}

var button = document.querySelector('#show');

button.addEventListener("click", function (ev) {
    ev.preventDefault();
    getData();
},false);

function addData(jsonData) {

    var city = document.querySelector('#city').value;

    var input = document.querySelector('#city');



}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Weather</title>
</head>
<body>
<h1>Weather</h1>

City: <input type="text" id="city" name="city" placeholder="city">
<button id="show" name="show">Show</button>

<script src="js/weather.js"></script>
</body>
</html>

标签： javascripthtmlapiopenweathermap

解决方案

XMLHttpRequest永远不会等于404。它是您用来创建发出 HTTP 请求的对象的构造函数！

你需要检查request.status。

推荐阅读