如果<select> option = 1则runaFunct else runaFifferentFunct？怎么样？

Question

我是初学者，但我已经制作了两个需要依赖选项的函数。如果用户选择“Wood”，那么它应该运行WoodFunct。如果他们选择“Dirt”，那么它应该运行该功能。当用户单击提交按钮时，应该全部运行。我知道我很接近，但我似乎无法得到它。这是我的代码： 函数WoodFunct（）{  var areaLength = document.getElementById（“textbox1”）。value;  var areaWidth = document.getElementById（“textbox2”）。value;  var areaDepth = document.getElementById（“textbox3”）。value;  var answer =（parseFloat（areaLength）* parseFloat（areaWidth）* parseFloat（areaDepth））* 27; var textbox4 = document.getElementById（'textbox4'）; textbox4.value =答案;  } function DirtFunct（）{  var areaLength = document.getElementById（“textbox1”）。value;  var areaWidth = document.getElementById（“textbox2”）。value;  var areaDepth = document.getElementById（“textbox3”）。value;  var answer =（parseFloat（areaLength）* parseFloat（areaWidth）* parseFloat（areaDepth））* 1.5; var textbox4 = document.getElementById（'textbox4'）; textbox4.value =答案;  } L：＆lt; input type =“text”name =“textbox1”id =“textbox1”/＆gt;＆lt; br＆gt; W：＆lt; input type =“text”name =“textbox2”id =“textbox2”/＆gt; ＆LT峰; br＆GT; D：＆lt; input type =“text”name =“textbox3”id =“textbox3”/＆gt; ＆LT峰; br＆GT; 产品： ＆LT;选择＆GT;    ＆lt; option value ='1'id =“WoodProduct”＆gt; Wood＆lt; / option＆gt;    ＆lt; option value ='2'id =“DirtProduct”＆gt; Dirt＆lt; / option＆gt;  ＆LT; /选择＆GT;＆LT峰; br＆GT; ＆lt; input type =“submit”name =“button”id =“button1”onclick =“runAFunction”value =“Submit”/＆gt; ＆LT峰; br /＆GT; 需要的平方英尺长度： ＆lt; input type =“text”name =“textbox4”id =“textbox4”readonly =“true”/＆gt;

Answer 1

您应该使用表单包装输入并绑定onsubmit事件：

＆＃13;

＆＃13;

function WoodFunct() { 
 var areaLength = document.getElementById("textbox1").value;
 var areaWidth = document.getElementById("textbox2").value; 
 var areaDepth = document.getElementById("textbox3").value; 
 var answer =(parseFloat(areaLength)*parseFloat(areaWidth)*parseFloat(areaDepth))*27;

var textbox4 = document.getElementById('textbox4');
textbox4.value=answer;
 } 

function DirtFunct() { 
 var areaLength = document.getElementById("textbox1").value;
 var areaWidth = document.getElementById("textbox2").value; 
 var areaDepth = document.getElementById("textbox3").value; 
 var answer =(parseFloat(areaLength)*parseFloat(areaWidth)*parseFloat(areaDepth))*1.5;

  var textbox4 = document.getElementById('textbox4');
  textbox4.value=answer;
} 
document.getElementById('form').onsubmit = function() {
  if (document.getElementById('select').value == 1) {
    WoodFunct();
  }
  else {
   DirtFunct();
  }
  return false;
}

＆＃13;

<form id="form">
L: <input type="text" name="textbox1" id="textbox1" /><br>
W: <input type="text" name="textbox2" id="textbox2" /> <br>
D: <input type="text" name="textbox3" id="textbox3" /> <br>
Product: 
<select id="select">
   <option value='1' id="WoodProduct">Wood</option>
   <option value='2' id="DirtProduct">Dirt</option>
 </select><br>
<input type="submit" name="button" id="button1" value="Submit" />
<br/>
Needed sq. footage:
<input type="text" name="textbox4" id="textbox4" readonly="true"/>
</form>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果你使用jquery，你可以做

 $(function() {

     $("#button1").click(function(){

            var selected = $("#select option:selected").text();

            if(selected === 'Wood')
               WoodFunct();
            else if(selected === 'Dirt')
               DirtFunct();
     });


   });

Answer 3

编写运行函数的简单方法是检查是否选择了每个选项。像这样。

function runAFunction() {
    if(document.getElementById("WoodProduct").selected = true)
        WoodFunct();
    else if(document.getElementById("DirtProduct").selected = true)
        DirtFunct();
}