Question

我有以下jQuery函数，当我单击页面上的按钮时调用该函数。此按钮应该重置表单并重新加载新页面。

function Create(txt) {
    if (txt="createUser") {
        document.forms[0].reset();
        $('#myform').each(function() {
            this.reset();
        });
        $('input[name=method]').val(txt);
        document.forms[0].submit();
    }
}

但出于某种原因，它根本没有转到this.reset()，我在动作类中看到了所有的表单值。我该怎么解决这个问题？

以下是按钮的定义方式。

<input type="button" value="Create" class="btn" onclick="Create('createUser');">

编辑：好的伙计..我知道输入类型=“重置”如何工作，我的页面中有另一个按钮做同样的事情..我有一个创建用户表单，我可以搜索并查看现有用户详细信息或填写表单并创建一个新用户。如果我搜索一个用户，然后单击创建以创建另一个用户，它会向服务器发送一个新请求并重新加载页面..但在动作类中..该bean尚未重置...我得到了所有值返回页面。因此..i想要重置表单...而不使用重置按钮......

我选择了John的答案..做了一点修改，下面是我使用的最终功能。

function Create(txt){
if (txt="createUser"){
var $form = $('#myform');
    $form.find(':input').not(':button,:submit, :reset, :hidden').val('').removeAttr('checked').removeAttr('selected'); // Clear all inputs
    $form.find('input[name=method]').val(txt);
    $form.submit();
}
}

Answer 1

您可以使用html代码

代替java脚本

<input type="reset" value="Reset">

Answer 2

您似乎在这里设置变量 -

if (txt="createUser"){...

将其更改为 -

if (txt == "createUser") {..

这样你就可以进行比较，而不是设置变量。

Answer 3

按钮没有type =“reset”所以要么将其更改为重置或使用

document.getElementById("myform").reset();而不是

document.forms[0].reset();
$('#myform').each(function(){
          this.reset();
    });

Answer 4

正如其他人所指出的，你有=你应该有==，但这意味着if语句总是如此。但是，这并不是您“在我的动作类中查看所有表单值”的原因。

我认为问题可能是你误解了reset()方法的作用。它不会清除所有输入值;相反，它将它们重置为原始值（即“值”属性中的值）。

您可能希望自己清除它们，而不是使用reset()方法。

function Create(txt) {
    if (txt == 'createUser') {
        var $form = $('#myform');

        // Clear form values
        $form.find(':input:not(:button,:submit,:reset,:checkbox,:radio,:hidden)').val('');
        $form.find('input:checkbox,input:radio)').prop('checked', false);

        $form.find('input[name=method]').val(txt);
        $form.submit();
    }
}

注意：:input selector匹配所有输入，textarea，select和按钮元素。

注意：OP似乎不希望清除隐藏的输入，但是需要清除复选框和单选按钮。

Answer 5

我会这样做：

$(document).ready(function() {
    $("#createUserButton").on("click", function() {
        var form = $("#myForm")[0];
        form.reset();
        $("input[name=method]").val("CreateUser");
        form.submit();
    }
});

您的按钮变为：

<input type="button" value="Create" class="btn" id="createUserButton">

我建议您在输入文本中添加一个id属性，例如：

<input type="text" name="method" id="methodName" />

然后你可以通过id来引用它，这比名字更快，就像这样：

$("#methodName").val("CreateUser");

您的代码错误，如果您应该使用==或===而不仅仅是=而且您的表单应该只调用reset方法。无需使用each迭代id，即使因为ID必须在HTML页面中是唯一的。

这是一个工作fiddle，只需在第一个输入中键入内容即可查看它。

无法通过javascript或jquery重置表单

5 个答案: