HTML Real-Time Tutorial

1.12 Checking Spelling Mistakes

The Spell Check feature in HTML is used to detect grammatical or spelling mistakes in text fields. The spellcheck attribute is an enumerated attribute that defines whether the HTML element will be checked for errors or not.

Supported Elements

The spellcheck attribute can be applied to HTML elements like <input> and <textarea>. It supports all HTML elements.

Syntax

The syntax for using the spellcheck attribute in an input field or a textarea is as follows:

<input type="text" spellcheck="true">
<textarea spellcheck="true"></textarea>
        

The value assigned to the spellcheck attribute determines whether it will be enabled or disabled:

  • true: The HTML element should be checked for errors.
  • false: The HTML element should not be checked for errors.

If the attribute is not set, it will take the default value, which may vary based on the element type and the browser.

Example: Enabling Spell Check

<!DOCTYPE html>
<html>
<body>

<h3>Example of Enabling SpellCheck</h3>
<form>
  <p><input type="text" spellcheck="true"></p>
  <p><textarea spellcheck="true"></textarea></p>
  <button type="reset">Reset</button>
</form>

</body>
</html>
        

Output:

In this example, both the text input and the textarea will check for spelling mistakes automatically.

Example: Disabling Spell Check

<!DOCTYPE html>
<html>
<body>

<h3>Example of Disabling SpellCheck</h3>
<form>
  <p><input type="text" spellcheck="false"></p>
  <p><textarea spellcheck="false"></textarea></p>
  <button type="reset">Reset</button>
</form>

</body>
</html>
        

Output:

In this example, spell check is disabled for both the input and textarea fields.