javascript - 下拉菜单更改时调用 Javascript 函数

Question

我尝试在下拉菜单更改时实现函数调用。我认为我的问题是我对C++的编程风格想得太多了。我研究过这个问题，但没有找到类似的答案。

我的代码如下:

JS:

<script type="text/javascript">         

        var type = 0;
        var milk = 0;
        var extra = 0;

        settype(t) {
            type = t;
        }

        setmilk(m) {
            milk = m;
        }

        setextra(e) {
            extra = e;
        }

        function calculateCalories() {
            return (type*milk)+extra;
        }
        function reset() {
            type = 0;
            milk = 0;
            extra = 0;
        }
</script>

HTML:

<table border=4 width=800px>
<tr>
<td align=right>
<h2 style="text-align: left"> Your Coffee Drink: </h2>
<input type="text" name="Input" size="35" style="text-align: right"/>
Calories                       
</td>
</tr>

<td>
Calculate the calories of your favorite coffee drink! *
</td>

<td>
Select Type:
    <select id="coffeetypedropdown" onChange="settype(value);">
        <option value="">Select a Drink</option>
        <option value="0">Caffe</option>
        <option value="1">Caffe Latte</option>
        <option value="1">Caffe Macchiato</option>
        <option value="0">Caffe Americano</option>
        <option value=".5">Cappuccino</option>
    </select>
</td>

<td>
Select Type of Milk
    <select id="milkdropdown" onchange="setmilk(value);">
        <option value="">Select Type of Milk</option>
        <option value="80">Nonfat</option>
        <option value="100">1% Milk</option>
        <option value="120">2% Milk</option>
        <option value="150">Whole Milk</option>
        <option value="130">Soy Milk</option>
    </select>

</td>

<td>
Select Extra
    <select id="extradropdown" onchange="setextra(value);">
        <option value="">Select Extra</option>
        <option value="100">Whipped Cream</option>
        <option value="100">Chocolate Syrup</option>
        <option value="50">Caramel Syrup</option>
        <option value="10">Chocolate Powder</option>
        <option value="100">Heavy Cream</option>
    </select>

</td>


<td>
<input type="button" name="clear" VALUE="Clear" OnClick="Calc.Input.value = reset();">
<input type="button" name="Equals"  VALUE="Calculate!" OnClick="Calc.Input.value =    eval(calcCalories();)">
</td>



</td>

非常感谢您的帮助。

Answer 1

请在函数名称前添加函数。

<script>
    function settype(t) {
       alert(t);
    }
</script>

如果有任何疑问，请告诉我。 (您想在全局范围内添加“settype”功能吗？ - 与全局变量相同)