OpenWeather Maps API位置重置：点击按钮后如何清空JSON结果？

嘿，我看你想给这个定位功能加个重置按钮，清空显示的JSON结果对吧？你当前写的代码没起作用是因为**this在这里指向的是点击的按钮元素，不是你存储JSON结果的变量**，而且就算变量改了，页面上已经渲染出来的内容也不会自动更新哦。

我给你几个具体的解决步骤，结合你的场景来调整：

1. 先清空页面上的JSON显示内容 #

首先你得找到用来展示JSON结果的DOM元素（比如在你的示例里，那个输出JSON的区域应该是某个带ID的容器，比如<div id="json-result"></div>或者<pre>标签），然后用jQuery的方法直接清空它的内容：

$('#remove-location').on("click", function(){
  // 替换成你实际用来显示JSON的元素ID
  $('#json-result').empty(); 
  // 或者用 $('#json-result').html(''); 效果一样
});

2. 重置存储结果的变量（如果有的话） #

如果你之前用了一个变量（比如res）来缓存获取到的定位JSON数据，那也要把这个变量重置，避免后续逻辑出错：

// 假设res是全局或者外层作用域的变量
let res;

// 你的定位逻辑代码...

$('#remove-location').on("click", function(){
  $('#json-result').empty();
  // 根据你之前的变量类型重置，比如空对象或者空字符串
  res = {}; 
});

3. 额外优化：重置地图相关状态（可选） #

如果你的示例里还有地图标记、定位点这类元素，最好一起移除，让重置更彻底。比如用地图API的移除方法（如果是Leaflet这类库的话）：

// 假设marker是你创建的地图标记变量
let marker;

$('#remove-location').on("click", function(){
  $('#json-result').empty();
  res = {};
  // 如果标记存在，就从地图上移除
  if (marker) {
    map.removeLayer(marker);
    marker = null; // 顺便清空标记变量
  }
});

简单说，你原来的代码只是给按钮元素加了个res属性，完全没触及到实际的结果存储和页面显示，所以才没效果。按照上面的步骤调整，就能实现点击按钮清空JSON结果的功能啦～

内容的提问来源于stack exchange，提问作者alench