0

我有这个 HTML 代码：

<html>
    <head>
        <script type="text/javascript">
            function showStuff(id) {
                var e = document.getElementById(id);
                if (e.style.display == 'block') e.style.display = 'none';
                else e.style.display = 'block';
            }
        </script>
    </head>
    <body>
        <FORM name=myForm>
            <TABLE border=0 align=center>
                <TBODY>
                    <TR>
                        <TD align=right>Quiz/Test Title:</TD>
                        <TD align=left>
                            <INPUT size=25 type=text name=t>
                        </TD>
                    </TR>
                    <TR>
                        <TD align=right>
                            <input type="button" value="Show/Hide" onclick="showStuff('multiplechoice')">
                        </TD>
                    </TR>
                </TBODY>
                <TBODY id="multiplechoice" style="display: none;" align=center>
                    <TR>
                        <TD align=right>
                            <h3>Multiple Choice</h3>
                        </TD>
                        </TD>
                        <TR>
                            <TD align=right>Section Name:</TD>
                            <TD align=left>
                                <INPUT size=20 type=text name=section1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Directions:</TD>
                            <TD align=left>
                                <INPUT size=71 type=text name=directions1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Question Number:</TD>
                            <TD align=left>
                                <INPUT size=2 type=text name=n1 id=n1 value=1 onkeypress="return alpha(event,numbers)">
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Question:</TD>
                            <TD align=left>
                                <textarea rows=2 cols=55 name=q1 id=q1></textarea>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Answer A:</TD>
                            <TD align=left>
                                <INPUT size=35 type=text name=a1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Answer B:</TD>
                            <TD align=left>
                                <INPUT size=35 type=text name=b1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Answer C:</TD>
                            <TD align=left>
                                <INPUT size=35 type=text name=c1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Answer D:</TD>
                            <TD align=left>
                                <INPUT size=35 type=text name=d1>
                            </TD>
                        </TR>
                        <TR>
                            <TD align=right>Answer (A,B,C,D):</TD>
                            <TD align=left>
                                <INPUT size=1 type=text name=correct1 onkeyup="upper(this)" onkeypress="return alpha(event,letters)" maxlength="1">
                            </TD>
                        </TR>
                </TBODY>
            </TABLE>
        </FORM>
    </body>
</html>

好的，问题是当我单击显示/隐藏时，它会显示表单，但会将表单中的所有内容移到左侧。我希望它保持在中心对齐。有没有办法做到这一点？我省略了与其他所有功能相关联的所有其他功能，所以不用担心它会起作用。任何帮助是极大的赞赏。

4

1 回答 1

1

你为什么不把你的两个TBodys 放在单独的表中？

如下所示：

<FORM name=myForm>
<TABLE border=0 align=center>
    <TBODY>
         <TR>
             <TD align=right>Quiz/Test Title:</TD>
             <TD align=left>
                <INPUT size=25 type=text name=t>
            </TD>
        </TR>
        <TR>
             <TD align=right><input type="button" value="Show/Hide" onclick="showStuff('multiplechoice')">
             </TD>
        </TR>
     </TBODY>
</table>
<table border=0 align=center>
     <TBODY id="multiplechoice" style="display: none;" align=center>
         <TR>
            <TD align=right><h3>Multiple Choice</h3></TD>
             </TR>
         <TR>
            <TD align=right>Section Name:</TD>
            <TD align=left><INPUT size=20 type=text name=section1></TD>
             </TR>
         <TR>
            <TD align=right>Directions:</TD>
            <TD align=left><INPUT size=71 type=text name=directions1></TD>
             </TR>
         <TR>
            <TD align=right>Question Number:</TD>  
            <TD align=left><INPUT size=2 type=text name=n1 id=n1 value=1 onkeypress="return alpha(event,numbers)"></TD>
             </TR>   
         <TR>
            <TD align=right>Question:</TD>
            <TD align=left><textarea rows=2 cols=55 name=q1 id=q1></textarea></TD> 
             </TR>
         <TR>
            <TD align=right>Answer A:</TD>
            <TD align=left><INPUT size=35 type=text name=a1></TD></TR>
         <TR>
            <TD align=right>Answer B:</TD>
            <TD align=left><INPUT size=35 type=text name=b1></TD>
             </TR>
         <TR>
            <TD align=right>Answer C:</TD>
            <TD align=left><INPUT size=35 type=text name=c1></TD>
             </TR>
         <TR>
            <TD align=right>Answer D:</TD>
            <TD align=left><INPUT size=35 type=text name=d1></TD>
             </TR>
         <TR>
            <TD align=right>Answer (A,B,C,D):</TD>
            <TD align=left><INPUT size=1 type=text name=correct1 onkeyup="upper(this)" onkeypress="return alpha(event,letters)"   maxlength="1"></TD>
             </TR>
     </TBODY>
</TABLE>
</FORM>

它解决了一切。看到这个工作代码笔

于 2013-03-23T15:32:16.103 回答