HTML DOM Input Email autocomplete Property

HTMLWeb DevelopmentFront End Technology

The HTML DOM Input Email autocomplete property sets/returns whether autocomplete is enabled or disabled. If enabled, it shows previously typed values.

Syntax

Following is the syntax −

  • Returning value - on/off
inputEmailObject.autocomplete
  • Setting autocomplete to value
inputEmailObject.autocomplete = value

Values

Here, “value” can be the following −

valueDetails
onIt defines that input has autocomplete enabled, it is also the default.
offIt defines that input autocomplete attribute is disabled.

Example

Let us see an example of Input Email autocomplete property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Input Email autocomplete</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Email-autocomplete</legend>
<label for="EmailSelect">User Email :
<input type="email" id="EmailSelect" placeholder="eg: xyz@abc.com" autocomplete="off" autofocus>
</label>
<input type="button" onclick="addAutocomplete()" value="Enable Suggestions">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputEmail = document.getElementById("EmailSelect");
   divDisplay.textContent = 'Suggestions: '+inputEmail.autocomplete;
   function addAutocomplete() {
      inputEmail.autocomplete = 'on';
      divDisplay.textContent = 'Suggestions: '+inputEmail.autocomplete;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Before clicking ’Enable Suggestions’ button −

After clicking ‘Enable Suggestions’ button −

raja
Published on 24-Jul-2019 14:33:56
Advertisements