How does one disable spellcheck on input type=text?

html css input textarea spell-checking

11,044

Solution 1

From http://blog.whatwg.org/the-road-to-html-5-spellchecking#compatibility:

Google Chrome offers as-you-type spellcheck on <textarea> elements but not <input type=text> elements. It ignores the spellcheck attribute entirely. It does not offer the end user the option to change the default behavior or manually check individual fields.

So, it ends here.

Update: since Chrome 13 (released August 2011, 3 months after this answer), it's also supported on <input> elements.

Solution 2

Updated Jan 2020

spellcheck=false and spellcheck="false" now both work in Chrome.

Original answer:

While spellcheck=false doesn't work in Chrome as mentioned in the question, spellcheck="false" works successfully.

Solution 3

You can use either spellcheck=false or spellcheck="false" in an <input type="text">. This is a slight update to other answers posted.

jsfiddle.net/8nc2w6e0

Tested on Chrome 39.0.2171.95.

11,044

tybro0103

Coffee junkie, computer nerd, fitness monster, and father of two cool dudes.

Updated on December 27, 2020

Comments

tybro0103 over 3 years

I'd like to disable the spellcheck on my textfields <input type="text"> so as not to have any ugly red squigglies.

I understand others have asked this same question, but they always make the answer of putting spellcheck=false as accepted. That is not correct. That only works on a textarea, not input.

I'd like it to work in chrome at least.
- user3167101 about 13 years
  
  What browser do you see spell check on input elements? Also, no need to shout.
- leonbloy about 13 years
  
  stackoverflow.com/questions/4524000/…
- zellio about 13 years
  
  Also make a text area which is one row and cannot be resized and BAM text box.
BalusC about 13 years

I would not worry about this. It's enduser's own choice to spellcheck input fields. You should not force the browser to behave different on your site. I have immediately disabled spellchecking myself anyway.
Yeti over 11 years

@BalusC That is just stupid, there are enough reasons to disable accessibility options. For example if you do the spelling check yourself, same goes with the focus glow around buttons which you might want to handle yourself. Or maybe a practice application in JavaScript in which you want to see how well somebody can spell stuff as a matter of a test and there are many more reasons. Thus you should be able to force it, and luckily it is possible.
James Donnelly over 10 years

This does not provide an answer to the question. To critique or request clarification from an author, leave a comment below their post.
chuck911 over 10 years

@JamesDonnelly the answer is short - spellcheck="false" . but I can't post too short answer. this is not "critique or request clarification from an author",this is answer
James Donnelly over 10 years

This answer isn't correct and is more of a comment than an answer. You don't need to wrap HTML attributes in quotes, and the spellcheck property is designed specifically for textarea elements.
chuck911 over 10 years

@JamesDonnelly try it in your chrome yourself !
James Donnelly over 10 years

the spellcheck attribute doesn't affect input elements in Chrome. Setting it to true or false will not achieve anything.
Alfred Xing over 10 years

@JamesDonnelly May be surprising, but it does work now (I'm on Chrome 31.0.1650.34). jsfiddle.net/vr9pR - Type in some misspelled words in the two boxes.
Marino van der Heijden over 10 years

Works for me too. I'm happy with your answer @chuck911.
Sebas over 10 years

This answer is deprecated.
BalusC over 10 years

@Sebas: I believe you meant to say "outdated" :)
BalusC about 9 years

Note that the question explicitly says that it works on textarea fields, not on input fields. So it's very reasonable to assume that the OP just quickly entered the unquoted attribute value off top of head for the sake of asking a question rather than actually having used an unquoted attribute value as such.