Question

所以我有此表格，当您单击“提交”时，它应显示输入的信息。但它仅显示输入的第一个输入。我有另一张像这样的桌子工作正常，所以它一定是我没看到的小东西。

您在其中输入数据的表：

<form id="symptomstable" name="symptomstable">
    <table class="symptoms" width="700px" bgcolor="#BDDBCC" border="3" align="center">
        <th><b>Symptoms</b></th>
            <tr>
                <td><input type="text" name="sym1" size="100" id="sym1"></td>
            </tr>
            <tr>
                <td><input type="text" name="sym2" size="100" id="sym2"></td>
            </tr>
            <tr>
                <td><input type="text" name="sym3" size="100" id="sym3"></td>
            </tr>
            <tr>
                <td><input type="text" name="sym4" size="100" id="sym4"></td>
            </tr>
            <tr>
                <td><input type="text" name="sym5" size="100" id="sym5"></td>
            </tr>
            <tr>
                <td><input type="text" name="sym6" size="100" id="sym6"></td>
            </tr>

            <tr>
                <td align="center"><input type="button" value="Submit" name="submit" id="submit" onClick="display1()"/></td>
            </tr>
    </table>

输出到：

<table width="900px" align="center" border=1> 
    <tr style="background-color:#BDDBCC;"></br>
    <th align="center"><b>Symptoms Log</b></th>
    </tr> 
    <tr>
        <td align="center"><div id="symarea1"></div></td>
    </tr>
    <tr>
        <td align="center"><div id="symyarea2"></div></td>
    </tr>
    <tr>
        <td align="center"><div id="symarea3"></div></td>
    </tr>
    <tr>
        <td align="center"><div id="symarea4"></div></td>
    </tr>
    <tr>
        <td align="center"><div id="symarea5"></div></td>
    </tr>
    <tr>
        <td align="center"><div id="symarea6"></div></td>
    </tr>
    </table>

javascript：

function display1()
    {
    document.getElementById("symarea1").innerHTML = document.getElementById("sym1").value; 
    document.getElementById("sym1").value = "";
    document.getElementById("symarea2").innerHTML = document.getElementById("sym2").value; 
    document.getElementById("sym2").value = "";
    document.getElementById("symarea3").innerHTML = document.getElementById("sym3").value; 
    document.getElementById("sym3").value = "";
    document.getElementById("symarea4").innerHTML = document.getElementById("sym4").value; 
    document.getElementById("sym4").value = "";
    document.getElementById("symarea5").innerHTML = document.getElementById("sym5").value; 
    document.getElementById("sym5").value = "";
    document.getElementById("symarea6").innerHTML = document.getElementById("sym6").value; 
    document.getElementById("sym6").value = "";
    }

Answer 1

您只是有错字。如果您在尝试提交表单后打开控制台，则会看到错误消息Cannot set property 'innerHTML' of null。如果查看它所引用的行，您将看到它所引用的document.getElementById("symarea2").innerHTML = document.getElementById("sym2").value;

在您的HTML中，此元素的ID当前为symyarea2。参见：<td align="center"><div id="symyarea2"></div></td>。

在CF Conventions和Firefox 中查看如何使用控制台

该表未显示所有输入的数据

1 个答案: