In this blog, we learn how to clear the input and a form on click in javascript. Often when the user realizes that he has filled the form wrong or has entered the wrong input box, then there is a need to reset the form. In such a situation, with the help of javascript, we can easily reset the input box at the click of a button.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Clear Input Field on Click in Javascript</title>
<script src="script.js"></script>
</head>
<body style="background-color: lightcyan;">
<input type="text" id="name_input_id" placeholder="Name"/>
<button type="button" onclick="InputBoxReset('name_input_id')">x</button> <br> <br>
<input type="email" id="email_input_id" placeholder="Email"/>
<button type="button" onclick="InputBoxReset('email_input_id')">x</button>
</body>
</html>
script.js
Here I make the ” InputBoxReset ” dynamic a function. In this, I pass input field id put blank value into the input box.
function InputBoxReset(inputID){
document.getElementById(inputID).value = '';
}
Result

I hope it will help you.

Brijpal Sharma is a web developer with a passion for writing tech tutorials. Learn JavaScript and other web development technology.