Веб-API Change Event Weather - PullRequest
Новая
       18

Веб-API Change Event Weather

0 голосов
/ 25 марта 2020

Я следовал руководству YouTube по созданию веб-API погоды. Я решил добавить поле ввода текста или раскрывающееся меню и нажать кнопку отправки. Я надеюсь выполнить sh, введя город, например, "Ухань", это изменит переменную (например, с "Бреда" на "Ухань"). В приведенном ниже коде я провел некоторое тестирование с созданием Alert.
var city = "Breda"; из моего файла сценария. 

<!DOCTYPE html> <html lang="en"> <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>API</title>
  <h1> This is my weather API </h1>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT"
          crossorigin="anonymous">
  </script>

  <script src="script.js"></script>

  <link rel="stylesheet" href="style.css"> </head>

  <body>
    <input type="text" id="myText" value="Enter your city..">

    <button onclick="myFunction()">Enter</button>

    <p id="demo"></p>

    <div class="weather-container">
      <img class="icon">
      <p class="weather"></p>
      <p class="temp"></p>
    </div>
  </body>

</html>

var city = "Breda";

function myfunction() {
  var mycity = document.getElementById("myText").value;
  document.getElementById("demo").innerHTML = mycity; }

// *  function myfunction() {
var city = document.getElementById("myText".value);
document.getElementById("demo").innerHTML = city; } // 

function giveCity(myObj){
  city = myObj.value;     this.getMessage(); }

function getMessage(){
  alert("Welkom how are you "+ this.city);     }

$.getJSON("http://api.openweathermap.org/data/2.5/weather?q=" + city +
          "&units=metric&APPID=03b918615b4ecf29005b2a3151cad4dd", function(data)
          {
  console.log(data);
  var icon = "http://openweathermap.org/img/w/" + data.weather[0].icon + ".png";        
  var temp = Math.floor(data.main.temp);
  var weather = data.weather[0].main;
  $('.icon').attr('src', icon);
  $('.weather').append(weather);
  $('.temp').append(temp);

});
...