I am using the latest Chrome browser Version 55.0.2883.87 m.

On input elements on a HTML web page, how do I dynamically over-ride the language of the Chrome browser spell checker using JQuery/JavaScript?

For example if the page is displayed in English (US) and the spell checker is set to English (US), how can I pass in the German language code of de, so that the text area of all the input elements inside the form will spell check the input(s) with the German language and not the English (US) language?

Here is an example HTML text area.

<textarea cols="40" id="id_objective_details" maxlength="1000" name="objective_details" rows="10" class="kmw-disabled keymanweb-font textArea01"></textarea>

I am using the latest Chrome browser Version 55.0.2883.87 m.

On input elements on a HTML web page, how do I dynamically over-ride the language of the Chrome browser spell checker using JQuery/JavaScript?

For example if the page is displayed in English (US) and the spell checker is set to English (US), how can I pass in the German language code of de, so that the text area of all the input elements inside the form will spell check the input(s) with the German language and not the English (US) language?

Here is an example HTML text area.

<textarea cols="40" id="id_objective_details" maxlength="1000" name="objective_details" rows="10" class="kmw-disabled keymanweb-font textArea01"></textarea>

• javascript
• jquery
• html
• google-chrome
• spell-checking

• Have you tried setting the lang attribute to the element? <textarea lang="de"></textarea> – Towelie Commented Dec 21, 2016 at 1:42
• Minum, yes tried that, but no effect. Also tried placing the lang="de" in the form tag <from ... lang="de">, also no effect. – user1261774 Commented Dec 21, 2016 at 1:45
• Try adding spellcheck attribute – Vinay Commented Dec 21, 2016 at 9:08
• Novice, thanks. Tried that (with lang="de"), but no effect. Also tried same in the form tag, again no effect. I have run out of ideas. – user1261774 Commented Dec 21, 2016 at 20:25
• 2 Did you read this? stackoverflow./questions/21306199/… – Reeno Commented Dec 23, 2016 at 0:13

1 Answer 1

tl;dr

You can change the language using setAttribute('lang', lang) but Chrome doesn't use the lang attribute for spellcheck. This is a won't fix issue. Check the thread for more info.

Instead Chrome makes use of the user dictionaries which has to be selected by the user. (Try right-clicking a text-area -> Spellcheck -> Select language). Also the user should have the dictionary installed or else the spellcheck will not be possible.

You can try the following script and note that changing the lang attribute will not have effect but changing the language manually as mentioned above will.

function toLang(lang) {
  document.getElementById('id_objective_details').setAttribute('lang', lang);
}

<h3>Here is some random German text</h3>
<p>Hallo Welt, hallo und hallo wieder Welt.</p>

<h3>Here is some random English text</h3>
<p>Hello world, hello and hi again world.</p>
<textarea cols="40" id="id_objective_details" maxlength="1000" name="objective_details" rows="10" class="kmw-disabled keymanweb-font textArea01" spellcheck="true"></textarea>
<br>
<button onclick="toLang('en')">English check</button>
<button onclick="toLang('de')">German check</button>

You can perhaps use some external libraries like JavaScript SpellCheck or JQuery SpellCheck to get the job done.