javascript - 如何重置值

Question

如果我单击值为 100 的按钮，结果为 100，它将显示在输入字段上，如果我单击重置按钮，它将清除该字段。但问题是，如果我再次单击值为 100 的按钮，结果将变为 200。

function resultreset() {
    document.getElementById("result").reset();
}

我希望重置按钮将重置（归零）输入字段中的结果，但它只是清除它。

Answer 1

请参阅以下文档HTMLFormElement.reset()：

HTMLFormElement.reset() 方法恢复表单元素的默认值。此方法与单击表单的重置按钮执行相同的操作。

默认值不是 0，而是一个空字符串。如果您希望默认值为 0，则必须在 HTML 中明确说明，例如

<input value="0">

function resultreset() {
    document.getElementById("result").reset();
}

button.onclick = resultreset;

<form id="result">
  <input value="0">
</form>
<button id="button">click</button>

Answer 2

如果将其放入表单标签中，它将正常工作因为您不能在输入标签上使用 reset() 方法，它肯定会引发错误。

您的输出可以通过两种方式实现：

首先使用表格

function myFunction() {
  document.getElementById("myForm").reset();
}

<form id="myForm">
 
 <input type="text" name="lname" value="0">
  <input type="button" onclick="myFunction()" value="Reset ">
</form>

第二次使用defaultValue属性

document.getElementById("input_id").defaultValue = "0";