Question

我尝试将onSubmit用作函数，但这并没有真正解决。那是我的形式：

<form id="myform" name="myform" onreset="resetFunction()" onsubmit="submitFunction()">

这是我的职责：

 function submitFunction(){
    $('.hide').hide("fast");
    $('#email').updateStatus();
    $('#passwort').updateStatus();
    $('#passwordwd').updateStatus();
    $('#hobby').updateStatus();
    $('input[name=gender], input[name=sportart]').updateStatus();
    check=1;

}

隐藏不会被执行。它只是清除所有字段而不做任何其他事情。

这是updateStatus代码：

function updateStatus() {
    var person = [];
    person[0] = $('#email').val();
    person[1] = $('#passwort').val();
    person[2] = $('#passwortwd').val();
    person[3] = $('input[name=gender]:checked').val();
    person[4] = $('input[name=sportart]:checked').val();
    person[5] = $('#hobby').val();


    $('#status').text(JSON.stringify(person));
}

Answer 1

提交表单时会运行提交功能。

提交表单时，会加载新页面。

对上一页所做的任何DOM更改都将丢失。

您需要使用服务器端代码实现它们，以便它们显示在新页面中。

此外，$('#email').updateStatus();和co除了错误之外不会执行任何操作并导致submitFunction中止。

您已将function updateStatus()定义为全局（因为它根本不处理上下文而被设计为使用），而不是a jQuery plugin。

如果您想阻止提交表单（在这种情况下请确保you have a sensible fallback），那么您需要：

修复JS中的错误（只调用updateStatus()一次，然后直接执行（不作为jQuery方法）。
停止提交表单（通过将return false添加到onSubmit函数的末尾）。你最好转移到JavaScript绑定事件。内在事件属性充斥着陷阱，无法处理separation of concerns

Answer 2

将提交功能更改为：

function submitFunction(){
    $('.hide').hide("fast");
    $('#email').updateStatus();
    $('#passwort').updateStatus();
    $('#passwordwd').updateStatus();
    $('#hobby').updateStatus();
    $('input[name=gender], input[name=sportart]').updateStatus();
    check=1;
    return false;
}

通过在onSubmit函数中返回false，页面实际上不会提交表单，因此页面不会重新加载，因此您进行的DOM操作应保留在屏幕上。

Answer 3

使用此表格：

<form id="myform" name="myform" onreset="resetFunction()" onsubmit="submitFunction(); return false;">

或者使用这个jQuery代码：

$('#myform').submit(function(e) {
    $('.hide').hide("fast");
    $('#email').updateStatus();
    $('#passwort').updateStatus();
    $('#passwordwd').updateStatus();
    $('#hobby').updateStatus();
    $('input[name=gender], input[name=sportart]').updateStatus();
    var check = 1;

    e.preventDefault();
});

表单onSubmit无法正常工作

3 个答案: