我有javascript函数,如果值"abc", "abcd"或"abcde"已从下拉菜单"optionDrop"中选择,然后显示另一个下拉菜单"numberDrop",否则输出"N/A"。问题是"numberDrop"下拉菜单根本没有出现。我做错了什么?
下面是javascript函数:
function getDropDown() {
var optionDrop = document.getElementsByName("optionDrop");
var noOfAnswers = document.getElementById("noOfAnswers");
var numberDrop = document.getElementsByName("numberDrop");
if (optionDrop.value = "abc" || optionDrop.value = "abcd" || optionDrop.value = "abcde"){
numberDrop.style.display = "block";
}else{
noOfAnswers.innerHTML = "N/A";
}
}
下面是html下拉菜单的形式:
<form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" onsubmit="return validateForm(this);" >
<table id="middleDetails" border="1">
<tr>
<td>Option Type:</td>
<td>
<select name="optionDrop" onClick="getDropDown()">
<option value="">Please Select</option>
<option value="abc">ABC</option>
<option value="abcd">ABCD</option>
<option value="abcde">ABCDE</option>
<option value="trueorfalse">True or False</option>
<option value="yesorno">Yes or No</option>
</select>
</td>
<tr>
<td colspan="2"></td>
<td>Number of Answers:</td>
<td id="noOfAnswers">
<select name="numberDrop" id="numberDropId">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
</tr>
</table>
</form>
CSS代码: /*css for QandATable.php*/
#numberDropId{
display:none;
}
尝试:
if (optionDrop.value === "abc")
===是相同类型的精确匹配。所以它必须匹配abc。
修改javascript函数如下:
function getDropDown() {
var optionDrop = document.getElementsByName("optionDrop");
var noOfAnswers = document.getElementsByName("noOfAnswers");
var numberDrop = document.getElementsByName("numberDrop");
if (optionDrop[0].value == "abc" || optionDrop[0].value == "abcd" || optionDrop[0].value == "abcde"){
numberDrop[0].style.display = "block";
}else{
noOfAnswers.innerHTML = "N/A";
}
}
好运。普拉萨德