如何通过JavaScript重置(清除)表单?

时间:2010-09-24 11:42:37

标签: javascript jquery

我试过$("#client.frm").reset();但它没有用。那么如何通过jQuery重置表单?

13 个答案:

答案 0 :(得分:235)

form.reset()是一个DOM元素方法(不是jQuery对象上的方法),所以你需要:

$("#client.frm")[0].reset();
//faster version:
$("#client")[0].reset();

或者没有jQuery:

document.getElementById("client").reset();

答案 1 :(得分:37)

您可以这样做:

$("#client.frm").trigger('reset')

答案 2 :(得分:17)

纯JS解决方案如下:

function clearForm(myFormElement) {

  var elements = myFormElement.elements;

  myFormElement.reset();

  for(i=0; i<elements.length; i++) {

  field_type = elements[i].type.toLowerCase();

  switch(field_type) {

    case "text":
    case "password":
    case "textarea":
          case "hidden":

      elements[i].value = "";
      break;

    case "radio":
    case "checkbox":
        if (elements[i].checked) {
          elements[i].checked = false;
      }
      break;

    case "select-one":
    case "select-multi":
                elements[i].selectedIndex = -1;
      break;

    default:
      break;
  }
    }
}

答案 3 :(得分:4)

,reset()方法不会清除默认值和复选框字段,还有很多问题。

要完全重置,请检查以下链接 -

http://www.javascript-coder.com/javascript-form/javascript-reset-form.htm

答案 4 :(得分:4)

注意,如果表单中的某些输入标记具有属性form.reset()

,则函数name='reset'将不起作用

答案 5 :(得分:4)

重置(清除)表格Javascript&amp; jQuery

示例Javascript:

document.getElementById("client").reset();

示例jQuery:

您可以尝试使用trigger() Reference Link

$('#client.frm').trigger("reset");

答案 6 :(得分:2)

试试这个:

$('#resetBtn').on('click', function(e){
    e.preventDefault();
    $("#myform")[0].reset.click();
}

答案 7 :(得分:0)

使用JavaScript函数reset()

document.forms["frm_id"].reset();

答案 8 :(得分:0)

清除表格如下

document.forms[0].reset();

您只需清除组中的表单元素即可。使用此forms[0]

答案 9 :(得分:0)

试试这段代码。答案的完整解决方案。

    <!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(":reset").css("background-color", "red");
});
</script>
</head>
<body>

<form action="">
  Name: <input type="text" name="user"><br>
  Password: <input type="password" name="password"><br>
  <button type="button">Useless Button</button>
  <input type="button" value="Another useless button"><br>
  <input type="reset" value="Reset">
  <input type="submit" value="Submit"><br>
</form>

</body>
</html>

答案 10 :(得分:0)

您可以使用以下内容:

$('[element]').trigger('reset')

答案 11 :(得分:0)

您可以使用onclick函数清除整个表单。这是代码。

 <button type="reset" value="reset" type="reset" class="btnreset" onclick="window.location.reload()">Reset</button>

window.location.reload()函数将刷新您的页面,所有数据都将清除。

答案 12 :(得分:0)

使用这个简单的技巧来重置表单

_("form_id").reset();