How to clear an input field on focus with CSS?

CSS Web Development Front End Technology

Following is the code to clear an input field on focus −

Example

<!DOCTYPE html>
<html>
<head>
<h1>Clearing an input field on focus example</h1>
<input type="text" onfocus="this.value=''" value="Some random text...">
<h2>Click on the above field to clear its value</h2>
</body>
</html>

Output

The above code will produce the following output −

On clicking the field, the inner value will be cleared −

AmitDiwan

Published on 08-Apr-2020 14:29:44

Previous Page Print Page