Question

我有一个html表单，其字段是动态填充的。我想立刻清除所有字段。什么是最好和最简单的方法。对于普通的静态表单，我使用了$（＆＃34;＃form＆＃34;）[0] .reset（）并且它可以工作，但它不适用于动态表单。

Answer 1

reset()将表单字段还原为其value属性的内容，无论是将其定义为静态HTML还是动态创建的DOM节点：

＆＃13;

$('form').append('<input class="dynamic" value="original dynamic value">');

// note these will behave differently:
$('#two').val("Changed by setting .val()");
$('#three').attr("value","Changed by updating value attribute");
    
$('button').on("click",function() {
   $('form')[0].reset();
   return false;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <button>reset</button>
  <input id="one" value="original static value">
  <input id="two" value="original static value">
  <input id="three" value="original static value">
</form>

＆＃13;

如果要清除字段，则需要将它们显式设置为空值：

＆＃13;

$('form').append('<input class="dynamic" value="original dynamic value">');

$('button').on("click",function() {
   $('form input').val('')
   return false;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>

  <button>reset</button>
  <input class="static" value="original static value">
</form>

＆＃13;

Answer 2

您可以使用此document.getElementById("myForm").reset();

在html中重置动态创建的表单字段

2 个答案: