如何使用选择选项对象值进行计算？

Question

我有一个概念性的问题。我想要做的是从a中选择项目 下拉式菜单。

在这个例子中，让我们假设两个输入。然后，我想调用onClick函数来添加这两个值并在某处显示它们。如果我将所有下拉项存储在对象中。

如何使用对象填充选择选项并使其包含的值可用于数学？

例如，拿这个对象：

let rifle = { 
     craftTime: 60,
     reqMats: 100
}

如何使用select选项中的值？

提前致谢。

Answer 1

1。您可以使用data-属性

<select>
<option data-craftTime="60" data-reqMats="100">Blah</<option>
...
</select>

并在您的更改处理程序或其他

中

var option = theSelect.options[theSelect.selectedIndex];
if (option) {
    // use option.dataSet.craftTime and option.dataSet.reqMats
    // or option.getAttribute("data-craftTime") on old browsers
}

2。或者是你的价值模式

<select>
<option value="60-100">Blah</<option>
...
</select>

和

var value = theSelect.value.split("-");
if (value.length == 2) {
    // use value[0] and value[1]
}

3。或者是值数组的索引

<select>
<option value="2">Blah</<option>
...
</select>

和

// One time
var items = [
    /*something*/,
    /*something*/,
    rifle,
    /*something*/,
};

// In your handler
var item = items[theSelect.value];
if (item) {
    // use item.craftTime and item.reqMats
}