javascript - How to clear text area with a button in html using javascript?

Question

I have button in html

<input type="button" value="Clear"> 
<textarea id='output' rows=20 cols=90></textarea>

If I have an external javascript (.js) function, what should I write?

Answer 1

通过在按钮单击上添加功能来更改您的 html

 <input type="button" value="Clear" onclick="javascript:eraseText();"> 
    <textarea id='output' rows=20 cols=90></textarea>

在你的 js 文件中试试这个：

function eraseText() {
    document.getElementById("output").value = "";
}

Answer 2

您需要附加一个click事件处理程序并从该处理程序中清除 textarea 的内容。

HTML

<input type="button" value="Clear" id="clear"> 
<textarea id='output' rows=20 cols=90></textarea>

JS

var input = document.querySelector('#clear');
var textarea = document.querySelector('#output');

input.addEventListener('click', function () {
    textarea.value = '';
}, false);

这是工作演示。

Answer 3

使用 jQuery 库，您可以执行以下操作：

<input type="button" value="Clear" onclick="javascript: functionName();" >

你只需要设置 onclick 事件，在这个 onclick 事件上调用你想要的函数。

function functionName()
{
    $("#output").val("");
}

上面的函数将文本区域的值设置为空字符串。

Answer 4

你的 HTML

<input type="button" value="Clear" onclick="clearContent()"> 
<textarea id='output' rows=20 cols=90></textarea>

你的 Javascript

function clearContent()
{
    document.getElementById("output").value='';
}

Answer 5

您可以简单地使用ID属性到表单并将<textarea>标签附加到表单，如下所示：

<form name="commentform" action="#" method="post" target="_blank" id="1321">
    <textarea name="forcom" cols="40" rows="5" form="1321" maxlength="188">
        Enter your comment here...
    </textarea>
    <input type="submit" value="OK">
    <input type="reset" value="Clear">
</form>