Question

我有一张表格：

function validateForm() {
document.getElementById("test").innerHTML = "hello?????";
}

<form name="myForm" onsubmit="return validateForm();" method="post">
            <table>
                <tr>
                    <td> some text </td>
                    <td>
                        <input type="radio" name="q1" value="1"> yes
                        <input type="radio" name="q1" value="0"> no
                    </td>
                </tr>
            </table>
    <input type="submit" value="Submit">
    </form>
    
    <h1 id="test"> hello </h1>

根据我读过的所有帖子，当我点击提交按钮时，这应该更新h1标签的内容。但事实并非如此。为什么呢？

Answer 1

提交此表单时，请清空操作属性。此表单将重新加载当前页面。页面中的所有数据都将重置默认值。

<form name="myForm" onsubmit="validateForm();return false;">
....
</form>

Answer 2

代码正在运行，它正在执行帖子并呈现页面，因此您没有看到它（页面重新加载本身或在提交后应该执行的操作）。如果要进行验证或停止提交，则应返回false或在表单上使用preventDefault（）。

Answer 3

它确实有效，但默认情况下提交输入会刷新页面。因此，您需要通过在函数末尾添加return false来防止这种情况。

function validateForm() {
    document.getElementById("test").innerHTML = "hello?????";
    return false;
}

Javascript没有更新h1标签

3 个答案: