Computer >> Computer tutorials >  >> Programming >> CSS

How to clear an input field on focus with CSS?


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 −

How to clear an input field on focus with CSS?

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

How to clear an input field on focus with CSS?