Question

    function display(){


        document.getElementById(code).style.display = 'block';
        document.getElementById(sname).style.visibility = 'visible';
       document.getElementById(ss).style.visibility = 'visible';
    }


           <input type="submit" value="Add Subject" name="addition" onclick="return display()">
    </form>
    <div id="F2" hidden="hidden">
        <form id="hiddenform" name="Assign" method="post" width="960" border="0" action="NewServlet" >
        <table align="center" cellspacing="10" cellpadding="0" id="t" >
                    <tr><td>
                        </td><td><input type="hidden" type="text" name="code" placeholder="Enter subject code"></td>
                    </tr>
                    <tr><td></td><td><input type="hidden" type="text" name="sname" placeholder="Enter subject name"></tr>
                    <tr></tr>
                    <tr></tr>
                    <tr><td></td><td><input type="hidden" type="submit"  value="ADD SUBJECT" name="ss"></td></tr>
        </table>
    </form>
    </div>
</body>

这个无法显示隐藏的字段可以帮助我，我喜欢显示两个文本fiels代码，sname和ss按钮

Answer 1

问题在于：<input type="hidden" type="text"。

输入可以有type="hidden"或type="text"，但不能同时包含两者。

如果要隐藏文字字段，请使用style="display_none"。

在您的情况下，您应该坚持type="text"。

Answer 2

在我解决您的问题之前，我已在您的代码中标记了以下内容：
1.您的代码不完整，第二行（html代码）</form>没有开始标记 2.即使您没有将document.getElementById(code)提供给输入元素，也使用了id。

隐藏的输入字段应该保持隐藏状态。您可以使用css通过设置style="display:none;"属性来隐藏和显示TextBox。

解决方案：
从input元素中删除type="hidden"。从您的代码中，您似乎只希望内部包含<div id="F2">的div <form id="hiddenform"在按钮点击时显示或隐藏。

为此，只需要JavaScript行中的一行，无需隐藏每个元素。

document.getElementById("F2").style.display = 'block';

您的完整代码：

<input type="submit" value="Add Subject" name="addition" onclick="return display()">
</form>
<div id="F2" style="display:none;">
    <form id="hiddenform" name="Assign" method="post" width="960" border="0" action="NewServlet" >
    <table align="center" cellspacing="10" cellpadding="0" id="t" >
      <tr><td></td>
          <td><input type="text"  name="code"  placeholder="Enter subject code"/></td>
      </tr>
      <tr><td></td>
           <td><input type="text" name="sname"  placeholder="Enter subject name"/></td>
      </tr>
      <tr></tr>
      <tr></tr>
      <tr><td></td><td><input  type="submit" value="ADD SUBJECT" name="ss"/></td></tr>
    </table>
</form>
</div>

JavaScript：

function display(){
     document.getElementById("F2").style.display = 'block';
}

Answer 3

实际上，我自己也遇到过同样的问题……除非您的通用大脑正在从 www3 学校复制代码，否则这些问题都不会奏效。在脚本文件中，Ajax 也比普通的 js 更好用。

<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">. 
</script>
 $(document).ready(function() {
   //once the addition button is clicked on
   $(".addition").click(function() {
     //this will show everything in F2
     $(".F2").show();
     //you can also move style="display:none" around to control what you 
       want to hide within the form
     //this is how you can hide individual elements on your form as well
     $(".submit").hide()
   
}
</script>

这个 style="display:none" 将隐藏整个表格，或者可用于隐藏不同的元素...一旦点击添加按钮，它将显示您想要显示的任何内容，由类调用。

       <input type="submit" value="Add Subject" class="addition" value="Submit">
</form>
<div class="F2" style="display:none">
    <form name="Assign" method="post" width="960" border="0" action="NewServlet" >
    <table align="center" cellspacing="10" cellpadding="0" id="t" >
                <tr><td>
                    </td><td><input class="inputCode" type="text" name="code" placeholder="Enter subject code"></td>
                </tr>
                <tr><td></td><td><input class="inputName" type="text" name="sname" placeholder="Enter subject name"></tr>
                <tr></tr>
                <tr></tr>
                <tr><td></td><td><input class="submit" type="submit"  value="ADD SUBJECT" name="ss"></td></tr>
    </table>
</form>
</div>

隐藏字段无法在jsp中显示

3 个答案: