组合框中的Javascript存储对象
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了组合框中的Javascript存储对象相关的知识，希望对你有一定的参考价值。
我有一堆格式的对象：
var Manchester ={
name: "Manchester",
latitude:53.3,
longitude:-2.2
};
存储在一个名为airports的数组中。然后我有一个id的qobxswpoi的combobox，它是从一系列对象中填充的，组合框显示了对象的名字：
combo然后我希望能够读取该对象的两个其他属性：
for(var i=0; i<airports.length; i++){
var opt=airports[i];
var el=document.createElement("option");
el.textContent=opt.name;
el.value=opt;
document.getElementById("combo").append(el);
}
然而，当我做var e = document.getElementById("combo");
var lat= e.options[e.selectedIndex].value.latitude;
var lon= e.options[e.selectedIndex].value.longitude;
和console.log的lats时，他们显示为未定义。
组合框是否将变量存储为其值？如果没有，我该怎么办，如果是这样，我如何提取其他信息？
答案
Option的值用于存储字符串而不是对象。
另一种方法是使用数据属性。
lonvar airports = [{
name: "Manchester",
latitude: 53.3,
longitude: -2.2
}];
for (var i = 0; i < airports.length; i++) {
var opt = airports[i];
var el = document.createElement("option");
el.textContent = opt.name;
el.value = i;
el.dataset.lat = opt.latitude;
el.dataset.lon = opt.longitude;
document.getElementById("combo").append(el);
}
document.getElementById("combo").addEventListener('change', function() {
var lat = this.options[this.selectedIndex].dataset.lat;
var lon = this.options[this.selectedIndex].dataset.lon;
console.log(lat, lon);
});另一答案
<select id='combo'>
<option>-----</option>
</select>是一个字符串，因此无法容纳一个对象。为什么不使用value呢？
EG
datasetvar airports = [{
name: "Manchester",
latitude: 53.3,
longitude: -2.2
}];
for (var i = 0; i < airports.length; i++) {
var opt = airports[i];
var el = document.createElement("option");
el.textContent = opt.name;
Object.keys(opt).forEach(function(k) {
el.dataset[k] = opt[k];
});
document.getElementById("combo").append(el);
}
var e = document.getElementById("combo");
var lat = e.options[e.selectedIndex].dataset.latitude;
var lon = e.options[e.selectedIndex].dataset.longitude;
console.log(lat);
console.log(lon);以上是关于组合框中的Javascript存储对象的主要内容，如果未能解决你的问题，请参考以下文章
精心收集的 48 个 JavaScript 代码片段，仅需 30 秒就可理解!（转载）