Question

当用户点击“重置”按钮时，我正在尝试让文本字段恢复为默认值。

当用户点击“重置”按钮时，现在只需用“。”替换用户的文本。

如何使用纯JavaScript（无jQuery）来实现？

HTML：

<p>Type the first number</p>
<input id="first" type="text" placeholder="First Number" />
<p>Type the second number</p>
<input id="second" type="text" placeholder="Second Number" />
<button id="aButton">Apply</button>
<button id="rButton">Reset</button>
<div id="add"></div>

JAVASCRIPT：

app.onactivated = function (args) {
        var aButton = document.getElementById("aButton");
        aButton.addEventListener("click", buttonClickHandler, false);

        var rButton = document.getElementById("rButton");
        rButton.addEventListener("click", buttonResetHandler, false);

    };

...

function buttonResetHandler(evetInfo) {

        document.getElementById("first").innerText = '';
        document.getElementById("second").innerText = '';

    }

Answer 1

innerText是一个无效的属性，在IE浏览器中实现，用于设置/获取非表单元素的文本内容，如果值应设置为默认值，则为可以使用defaultValue属性：

var a = document.getElementById("first"),
    b = document.getElementById("second");
a.value = a.defaultValue;
b.value = b.defaultValue;

如果要重置所有表单元素，可以使用DOM HTMLFormElement对象的.reset()方法：

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

Answer 2

location.reload(); // 重新加载页面
history.go(0); // 删除历史记录
但是，如果您需要在页面内保留一些值，请再次重新分配函数中的值。要重新分配，请在 let 中再次写入变量（在 function 中声明以便稍后更改）并再次更改 textContent。

Answer 3

替换，

document.getElementById("first").innerText

使用，

document.getElementById("first").value

示例：

<input id="txtBox" type="text" value="lama">
<input type="button" value="reset lama" onclick='document.getElementById("txtBox").value="lama2";'>

Answer 4

创建一个init函数，为每个输入设置默认值，然后你可以调用它：

function initializeInputs() {
    document.getElementById("first").value = '';
    document.getElementById("second").value= '';
}

function buttonResetHandler(e) {
    initializeInputs();
}

当用户单击重置按钮JavaScript时，恢复文本字段的默认值

4 个答案: