按邮政编码的 openweathermap 天气数据不起作用？

Question

我需要做到这一点，以便在框中输入邮政编码并单击提交按钮时，城市名称会显示在其下方。当我在输入邮政编码后单击按钮时，城市名称没有显示。它说错误是 wallOfText 不是函数，但我不确定如何修复它。任何帮助，将不胜感激！！这是代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <meta charset="UTF-8">
    <title>Example</title>
</head>
<body>
Enter your zip code:<br><input type="text" id="zipBox" name="zipCode"><br><br>
<button onclick="weatherFunction()">Submit</button>
<p id="result"></p>
<script>
    function weatherFunction() {
        var zip = document.getElementById("zipBox").value;
        jQuery(document).ready(function ($) {
            $.ajax({
                url: "http://api.openweathermap.org/data/2.5/weather?zip=" +zip+ ",us&appid=b3456f9acbfa64fc4495e6696ecdc9a5",
                dataType: "jsonp",
                success: function (wallOfText) {
                    city = wallOfText("name");
                    if (zip != null) {
                        document.getElementById("result").innerHTML = wallOfText;

                    }
                }
            });
        });
    }
</script>
</body>
</html>

Answer 1

您遇到的问题是您试图像调用函数一样调用 wallOfText，而实际上它是从 AJAX 调用的响应中反序列化的对象。因此，您需要访问对象的 name 属性来设置 city 变量，然后使用它来设置 #result 元素的 text()。

请注意，函数中的 document.ready 处理程序是多余的，您应该在发出请求之前 进行值验证。我还更新了逻辑以使用 jQuery 来绑定按钮上的事件处理程序，而不是过时的 onclick 属性。试试这个：

jQuery(function() { $('#send').click(function() { var zip = $("#zipBox").val(); if (zip !== '') { $.ajax({ url: "http://api.openweathermap.org/data/2.5/weather?zip=" + zip + ",us&appid=b3456f9acbfa64fc4495e6696ecdc9a5", dataType: "jsonp", success: function(wallOfText) { var city = wallOfText.name; $("#result").text(city); } }); } }); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> Enter your zip code:<br> <input type="text" id="zipBox" name="zipCode" value="90210" /><br /><br /> <button type="button" id="send">Submit</button> <p id="result"></p>

按邮政编码的 openweathermap 天气数据不起作用？

openweathermap weather data by zip code not working?

javascript

jquery

weather

openweathermap