Question

我有两个文字标签：

<div>           
    <input type="text" id="textfield1" size="5"/>
</div>

<div>          
    <input type="text" id="textfield2" size="5"/>           
</div>

我想要一个名为“Clear”的按钮，可以删除这两个字段。

据我所知，我知道要实现一个按钮我应该使用这样的代码：

<div>      
    <input type="button" value="Clear Fields" onclick=SOMETHING />
</div>

有关如何实施SOMETHING？

的任何线索

Answer 1

如何只是一个简单的重置按钮？

<form>

  <input type="text" id="textfield1" size="5">
  <input type="text" id="textfield2" size="5">

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

</form>

Answer 2

一个简单的JavaScript函数可以完成这项工作。

function ClearFields() {

     document.getElementById("textfield1").value = "";
     document.getElementById("textfield2").value = "";
}

只需按下按钮即可：

<button type="button" onclick="ClearFields();">Clear</button>

Answer 3

如果你想重置它，那么简单使用：

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

但要注意，它不会清除默认value 的文本框。例如，如果我们有以下文本框，默认情况下，它们具有以下值：

<input id="textfield1" type="text" value="sample value 1" />
<input id="textfield2" type="text" value="sample value 2" />

所以，要清除它，用javascript补充它：

function clearText()  
{
    document.getElementById('textfield1').value = "";
    document.getElementById('textfield2').value = "";
}

并将其附加到重置按钮的onclick：
<input type="reset" value="Reset" onclick="clearText()" />

Answer 4

这样的东西会添加一个按钮，让你用它来清除值

<div>           
<input type="text" id="textfield1" size="5"/>         
</div>

<div>          
<input type="text" id="textfield2" size="5"/>           
</div>

<div>
    <input type="button" onclick="clearFields()" value="Clear">
</div>


<script type="text/javascript">
function clearFields() {
    document.getElementById("textfield1").value=""
    document.getElementById("textfield2").value=""
}
</script>

清除按钮单击上的文本字段

4 个答案: