Question

这是一个性别下拉菜单，用于确定统一费用。

 <p>Gender:
<select required name="gender" onchange="calc(this.id, 'uniform')"   id="gender">
<option value="0" >Select...</option>
<option value="male">Male</option>
<option value="female">Female</option>
</select> <p>

统一下拉菜单的费用

<p>Cost of Uniform:
<select  required name="uniform"   id="uniform">
</select><p>

以下是我的可靠性别和制服

的javascript代码

<script>
function calc(u1,u2){

var u1 = document.getElementById(u1);
var u2 = document.getElementById(u2);
u2.innerHTML = "";
if (u1.value == "male"){
var optionArray = ["|","24300|N24,300"];
}
else  if (u1.value == "female"){
var optionArray = ["|","26400|N26,400"];
}
for(var option in optionArray){
var pair = optionArray[option].split("|");
var newOption = document.createElement("option");
newOption.value = pair[0];
newOption.innerHTML = pair[1];
u2.options.add(newOption);
}
}
</script>

班级（年份）下拉菜单。

<p>Class:
<select required name="childClass" onchange="childClass(this.id, 'schoolFees')" id="childClass">
<option value="0" >Select...</option>
<option value="prenursery">Pre Nursery</option>
<option value="nursery">Nursery</option>
<option value="reception">Reception</option>
<option value="year1">Year One</option>
<option value="year2">Year Two</option>
<option value="year3">Year Three</option>
<option value="year4">Year Four</option>
<option value="year5">Year Five</option>
<option value="year6">Year Six</option>
</select>
<p>

学费下拉菜单取决于所选的学生班级

<p>School Fees:
<select required name="schoolFees"   id="schoolFees"> 
</select>

Javascript课程和学费可靠的下拉菜单。我确信有一个更短的方法，但这仍然有效。

<script>
function childClass(s1,s2){
   var s1 = document.getElementById(s1);
   var s2 = document.getElementById(s2);
 s2.innerHTML = "";
 if (s1.value == "prenursery"){
    var optionArray = ["|","145000|N145,000"];
 }
 else  if (s1.value == "nursery"){
    var optionArray = ["|","145000|N145,000"];
 }
 else  if (s1.value == "reception"){
    var optionArray = ["|","147000|N147,000"];
 }
 else  if (s1.value == "year1"){
    var optionArray = ["|","149000|N149,000"];
 }
 else  if (s1.value == "year2"){
    var optionArray = ["|","149000|N149,000"];
 }
 else  if (s1.value == "year3"){
    var optionArray = ["|","149000|N149,000"];
 }
 else  if (s1.value == "year4"){
    var optionArray = ["|","149000|N149,000"];
 }
 else  if (s1.value == "year5"){
    var optionArray = ["|","149000|N149,000"];
 }
 else  if (s1.value == "year6"){
    var optionArray = ["|","149000|N149,000"];
 }
 for(var option in optionArray){
     var pair = optionArray[option].split("|");
     var newOption = document.createElement("option");
     newOption.value = pair[0];
     newOption.innerHTML = pair[1];
     s2.options.add(newOption);
 }
 }
</script>

如何让课程（年份）和性别下拉菜单确定统一下拉列表中的值。例如。如果我选择女性和第4年，我应该在下拉菜单中获得不同的价值。

Answer 1

检查此https://jsfiddle.net/egq427g0/3/

我已修改childClass以相应地选择Gender和Class

在childClass调用calc函数结束时，如果Class

中选择了0，则重置统一

一个下拉菜单的结果由两个确定

1 个答案: