如何做一个HTML选择表单，其中所选选项更新JSON值

How to do an HTML select form where the selected option update a JSON value?

本文关键字：选项 更新 JSON 何做一 HTML 选择 表单      更新时间：2023-09-26

我目前有一个HTML+JS网页，我在其中硬编码起始条件（一个国家的西部，北部，东部，南部地理坐标）：

var WNES = { "W": 67.0, "N":37.5, "E": 99.0, "S": 5.0, "item":"India" };

然而，我只是对~180个国家的数据进行了数据挖掘，所以我也有：

var WSEN_list = [
    {"W":60.504050405040545;"S":29.306134923492337;"E":75.1575157515752;"N":38.47551472547255;"item":"Afghanistan"},
    {"W":11.611161116111646;"S":-17.94743030603061;"E":24.068406840684105;"N":-4.453854347434742;"item":"Angola"},
    {"W":19.279927992799315;"S":39.62168720072006;"E":21.00810081008106;"N":42.67814713471347;"item":"Albania"},
    {...}
];

我希望我的最终用户使用 html <select>元素选择一个国家/地区：

<form>
Select your country:
<select id="mySelect">
  <option>Afghanistan</option>
  <option>Albania</option>
  <option>Angola</option>
</select>
</form>

然后，存储用户选择的项目值（例如"安哥拉"），所以我可以使用这个键搜索我的数据列表并声明： 

var WNES = {"W":11.611161116111646;"S":-17.94743030603061;"E":24.068406840684105;"N":-4.453854347434742;"item":"Angola"};

如何做这样的选择按钮和系统，从WSEN_list更新我的WNES？

解决方案：看到这个小提琴

您可能希望对#mySelect节点上的change事件做出反应：

$('#mySelect').change(function(){
    // this code will be executed each time the selection change
    // you can get the selected country like this :
    var country = this.value;
    // do whatever you want with this value
});
相关文章：