To clear input field JavaScript onClick set input field to empty string using JavaScript function. Or Just use simple reset button.
<form>
<input type="text" id="textfield1" size="5">
<input type="text" id="textfield2" size="5">
<input type="reset" value="Reset">
</form>
Clear input field JavaScript onClick
A simple JavaScript function will do the job.
function ClearFields() {
document.getElementById("textfield1").value = "";
document.getElementById("textfield2").value = "";
}And just have your button call it:
<button type="button" onclick="ClearFields();">Clear</button>Complete example code
<!DOCTYPE html>
<html>
<body>
<body>
<div>
<input type="text" id="textfield1" size="5"/>
<input type="text" id="textfield2" size="5"/>
<button type="button" onclick="ClearFields();">Clear</button>
<script>
function ClearFields() {
document.getElementById("textfield1").value = "";
document.getElementById("textfield2").value = "";
}
</script>
</div>
</body>
</html>Output:
Do comment if you have any doubts or suggestions on this Js HTML topic.
Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version