我的下拉菜单显示不太好用

The display of my dropdown menus are quite not working

本文关键字:下拉菜单 显示 我的      更新时间:2023-09-26

我有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";
    }
                }

好运。普拉萨德