Javascript 如果用户在天气Api搜索中输入了错误的城市名称，如何使用try and catch？

我希望在用户输入无效的城市名称时弹出警报

尝试使用if-else并尝试catch方法，但不起作用。我正在使用天气API获取天气和温度

const getWeather = () => {
  let cityName = $("#cityName").val();
  let apiCall = `http://api.openweathermap.org/data/2.5/weather?q=${cityName}&mode=json&units=metric&appid=${
    CONSTANTS.appId
  }`;
  $.getJSON(apiCall, weatherData => {
    let cityName = weatherData.name;
    let countryName = weatherData.sys.country;
    let description = weatherData.weather[0].description;
    let tempMin = weatherData.main.temp_min;
    let tempMax = weatherData.main.temp_max;
    $("#city").text(cityName);
    $("#detail").text(description);
    $("#country").text(countryName);
    $("#mintemp").html(`Minimum: ${tempMin}<span>&#8451;</span>`);
    $("#maxtemp").html(`Maximum: ${tempMax}<span>&#8451;</span>`);
  });
};

我不希望出现错误，而是使用该错误显示一条消息，说明用户输入无效

---

整个代码链接是

在这种情况下，您不需要一个

try…catch

块，因为jQuery为您处理所有事情，但您需要嗅探HTTP状态代码。不要使用

$.getJSON（）

，而是使用

$.ajax（）

如果仍要使用

$.getJSON（）

，可以通过以下方式使用

.fail（）

链接方法：

let cityName = $("#cityName").val();
let apiCall = `http://api.openweathermap.org/data/2.5/weather?q=${cityName}&mode=json&units=metric&appid=${CONSTANTS.appId}`;

$.getJSON(apiCall, weatherData => {
  let cityName = weatherData.name;
  let countryName = weatherData.sys.country;
  let description = weatherData.weather[0].description;
  let tempMin = weatherData.main.temp_min;
  let tempMax = weatherData.main.temp_max;
  $("#city").text(cityName);
  $("#detail").text(description);
  $("#country").text(countryName);
  $("#mintemp").html(`Minimum: ${tempMin}<span>&#8451;</span>`);
  $("#maxtemp").html(`Maximum: ${tempMax}<span>&#8451;</span>`);
}).fail(() => {
  alert("City doesn't Exist!!");
  $("#cityName").val("");
  $("#city").text("");
  $("#detail").text("");
  $("#country").text("");
  $("#mintemp").html("");
  $("#maxtemp").html("");
});

让cityName=$（“#cityName”）.val（）；
让我们全部=`http://api.openweathermap.org/data/2.5/weather?q=${cityName}&mode=json&units=metric&appid=${CONSTANTS.appid}`；
$.getJSON（apiCall，weatherData=>{
设cityName=weatherData.name；
让countryName=weatherData.sys.country；
让description=weatherData.weather[0]。description；
设tempMin=weatherData.main.temp_min；
设tempMax=weatherData.main.temp_max；
$（“#城市”）.text（城市名称）；
$（“#详情”）。文本（说明）；
$（“#国家”）。文本（国家名称）；
$（“#mintemp”）.html（`Minimum:${tempMin}℃；`）；
$（“#maxtemp”）.html（`Maximum:${tempMax}℃；`）；
}).失败（（）=>{
警报（“城市不存在！！”；
$（“#城市名称”）.val（“”）；
$（“#城市”）。文本（“”）；
$（“#详情”）。文本（“”）；
$（“#国家”）。正文（“”）；
$（“#mintemp”）.html（“”）；
$（“#maxtemp”）.html（“”）；
});

在这种情况下，您不需要一个

try…catch

块，因为jQuery为您处理所有事情，但您需要嗅探HTTP状态代码。不要使用

$.getJSON（）

，而是使用

$.ajax（）

如果仍要使用

$.getJSON（）

，可以通过以下方式使用

.fail（）

链接方法：

let cityName = $("#cityName").val();
let apiCall = `http://api.openweathermap.org/data/2.5/weather?q=${cityName}&mode=json&units=metric&appid=${CONSTANTS.appId}`;

$.getJSON(apiCall, weatherData => {
  let cityName = weatherData.name;
  let countryName = weatherData.sys.country;
  let description = weatherData.weather[0].description;
  let tempMin = weatherData.main.temp_min;
  let tempMax = weatherData.main.temp_max;
  $("#city").text(cityName);
  $("#detail").text(description);
  $("#country").text(countryName);
  $("#mintemp").html(`Minimum: ${tempMin}<span>&#8451;</span>`);
  $("#maxtemp").html(`Maximum: ${tempMax}<span>&#8451;</span>`);
}).fail(() => {
  alert("City doesn't Exist!!");
  $("#cityName").val("");
  $("#city").text("");
  $("#detail").text("");
  $("#country").text("");
  $("#mintemp").html("");
  $("#maxtemp").html("");
});

让cityName=$（“#cityName”）.val（）；
让我们全部=`http://api.openweathermap.org/data/2.5/weather?q=${cityName}&mode=json&units=metric&appid=${CONSTANTS.appid}`；
$.getJSON（apiCall，weatherData=>{
设cityName=weatherData.name；
让countryName=weatherData.sys.country；
让description=weatherData.weather[0]。description；
设tempMin=weatherData.main.temp_min；
设tempMax=weatherData.main.temp_max；
$（“#城市”）.text（城市名称）；
$（“#详情”）。文本（说明）；
$（“#国家”）。文本（国家名称）；
$（“#mintemp”）.html（`Minimum:${tempMin}℃；`）；
$（“#maxtemp”）.html（`Maximum:${tempMax}℃；`）；
}).失败（（）=>{
警报（“城市不存在！！”；
$（“#城市名称”）.val（“”）；
$（“#城市”）。文本（“”）；
$（“#详情”）。文本（“”）；
$（“#国家”）。正文（“”）；
$（“#mintemp”）.html（“”）；
$（“#maxtemp”）.html（“”）；
});

try-catch到底有什么不起作用？您已经尝试了try-and-catch，但它不起作用。请打开该链接，并在检查控制台部分检查它，其中给出了404错误。我不希望用户输入错误时出现错误，而是希望弹出一个警报。无法执行。@ShefaliUpadhyay这绝对不是一个

try…catch

场景。您只需以正确的方式处理错误。看看我的答案。试一试到底是什么不起作用的？我们试过试一试，但它不起作用。请打开该链接，并在检查控制台部分检查它，其中给出了404错误。我不希望用户输入错误时出现错误，而是希望弹出一个警报。无法执行。@ShefaliUpadhyay这绝对不是一个

try…catch

场景。您只需以正确的方式处理错误。看看我的答案@ShefaliUpadhyay你能分享更新的代码吗？@ShefaliUpadhyay太棒了@ShefaliUpadhyay你能分享更新的代码吗？@ShefaliUpadhyay太棒了！