How to specify whether the element is to have its spelling and grammar checked or not in HTML?

HTML Web Development Front End Technology

Grammar and spelling errors in text fields can be found using the HTML spell check tool.

Using the spellcheck property, the spell check capability may be added to HTML forms. The spellcheck attribute is an enumerated attribute that specifies whether or not the HTML element will be checked for mistakes. It is compatible with HTML's "input" and "textarea" fields.

Syntax

Following are the syntax for including spell check in HTML −

<! -- For input field -->.
<input type="text" spellcheck="value">
<! -- For input text area -->.
<textarea type="text" spellcheck="value"></textarea>

Following are the examples…

Example: Spellcheck value =”true”

In the following example we triggered the spellcheck attribute to “true” to enable spellcheck in an html.


<!DOCTYPE html>
<html>
<body>
   <form>
      <p>Name:<input type="text" spellcheck="true"></p>
      <p>Address:<textarea spellcheck="true"></textarea></p>
      <button type="reset">Reset</button>
   </form>
</body>
</html>

Output

On executing the script, the output window pops up, consisting of an input area where the user can enter details. If there was any spelling mistake, the area will get underlined with a red line as we set the spellcheck="true."

Example: Spellcheck value=”false”

In the following example we triggered the spellcheck attribute to “false” to disable spellcheck in an html.


<!DOCTYPE html>
<html>
<body>
   <form>
      <p>Name:<input type="text" spellcheck="false"></p>
      <p>Address:<textarea spellcheck="false"></textarea></p>
      <button type="reset">Reset</button>
   </form>
</body>
</html>

Output

When the script is executed, it checks for the spellcheck value, which is, as previously stated, spellcheck="false." There is no way for the user to check whether he entered correct spelling.