将HTML下拉菜单值传递给JavaScript函数&onclick函数调用

我知道这个问题有好几种问法，但它们对我没有帮助，当我试着调试这个问题时，我遇到了一个未定义的错误

它很简单：我有一个HTML下拉菜单，上面有几个不同的度量单位，我给每个单位一个值。我希望将所选值传递给JavaScript函数，该函数将检查公制单位类型，然后将其转换为相应的英制单位

下拉列表HTML：

e<p><span><label for="metric-unit">Select metric unit</label></span>
                    <select name="metric" id="metric">
                        <option value="cel">Celsius</option>
                        <option value="cm">Centimeters</option>
                        <option value="kg">Kilograms</option>
                        <option value="ml">Milliliters</option>
                    </select>
                </p>

我的第二个问题是调用转换函数。一旦选择了公制单位，并在文本字段中输入了一个数字，然后用户单击提交按钮，我就会这样做。我应该调用带参数还是不带参数的函数，特别是如果在进行任何数学运算之前使用getElementById获取度量单位的值和数字

是吗

onlick ="convertMeasure()"

或

---

假设提交按钮和文本字段的id分别为sub和txt，并且您有一个默认值，如选择值为0的单位：

---

首先获取select元素

var select = document.getElementById("metric");

然后，您可以使用所选索引从选项中读取值

var metric = select.options[select.selectedIndex].value;

至于如何调用convertMeasure方法，如果要动态地从多个元素获取值，我建议使用第一种方法

---

这里有一个jsfiddle可以使用

它看起来像是在html中的某个地方放置了单击绑定，如下所示

<div onclick='callThisFunction()'> Click on this div </div>

然后在javascript中，您可以使用该函数。在其中，您可以获得下拉列表的选定值，并执行所需的任何逻辑操作

<script>
   function callThisFunction() {
       var dropdown = document.getElementById("metric");
       var unit = dropdown.options[dropdown.selectedIndex].value;
       var nameOfUnit = dropdown.options[dropdown.selectedIndex].text;

       if (unit == "cm") {
           // do stuff
       } else if (unit == "ml") {
           // do stuff
       }
       // etc.
   }
</script>

---

离题：您的for属性与select的id不匹配。想知道这些答案是否有用…@CraneWing是否有任何答案帮助？如果是的话，你能接受其中一个吗？这也将有助于未来的读者。。

var metric = select.options[select.selectedIndex].value;

<div onclick='callThisFunction()'> Click on this div </div>

<script>
   function callThisFunction() {
       var dropdown = document.getElementById("metric");
       var unit = dropdown.options[dropdown.selectedIndex].value;
       var nameOfUnit = dropdown.options[dropdown.selectedIndex].text;

       if (unit == "cm") {
           // do stuff
       } else if (unit == "ml") {
           // do stuff
       }
       // etc.
   }
</script>