Comment effacer une zone de texte avec un bouton en HTML à l'aide de javascript?

Question

J'ai bouton en html

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

Si j'ai une fonction javascript externe (.js), que dois-je écrire?

Answer 1

Changer dans votre html avec l'ajout de la fonction sur le clic du bouton

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

Essayez ceci dans votre fichier js:

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

Answer 2

Vous devez attacher un gestionnaire d'événements click et effacer le contenu de la zone de texte de ce gestionnaire.

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);

et voici la démo working .

Answer 3

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

il vous suffit de définir l'événement onclick, appelez la fonction souhaitée pour cet événement onclick.

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

La fonction ci-dessus définira la valeur de la zone de texte sur chaîne vide.

Answer 4

Votre html 

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

Votre javascript

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