javascript - how to detect user's language while heshe is typing - Stack Overflow

admin管理员组

文章数量:1222399

guys i have a problem with this thing , i must know which language the user is using while typing in an input text to handle some bad shaped things and i even looked at this in here but it didn't helped me , can u guys help me with the right code ?
the languages i must know are english and persian :| thanks :) i need some javascript helps

<input type="text" id="give_me_the_lang">
<div id="show_lang_in_here"></div>

guys i have a problem with this thing , i must know which language the user is using while typing in an input text to handle some bad shaped things and i even looked at this in here but it didn't helped me , can u guys help me with the right code ?
the languages i must know are english and persian :| thanks :) i need some javascript helps

<input type="text" id="give_me_the_lang">
<div id="show_lang_in_here"></div>

• javascript

Share Improve this question Follow edited May 23, 2017 at 12:20 CommunityBot 111 silver badge asked Jan 20, 2015 at 9:47 user3590110user3590110 11311 gold badge11 silver badge66 bronze badges 7

• Do you want to detect the language the user is typing in? – surajck Commented Jan 20, 2015 at 9:49
• yea , thats what i want – user3590110 Commented Jan 20, 2015 at 9:53
• 2 What makes you imperatively rely on detecting the language while the user is typing? There are browser extensions for spelling that would make this task on the client side pointless at best. Detecting a language is a really complex operation and to my knowledge only office suites support such a feature, which I sense to require heavy coding. Also, as far as I recall, their language detection is far from foolproof. – user4113344 Commented Jan 20, 2015 at 9:59
• Yes. I agree. You can give a dropdown where the user can select which language he is going to write in. That way you would know. – surajck Commented Jan 20, 2015 at 10:00
• the thing is user will type a mix lang , both rtl and ltr languages , so i need to know which One is typing to handle its shape , cause writing in ltr text with rtl will be the worst thing u wanna see in a site and vice versa – user3590110 Commented Jan 20, 2015 at 10:06

 |  Show 2 more comments

2 Answers 2

Sorted by: Reset to default 12

Here is the solution that doesn't really detect language, but just checks if users input contains only English alphabet. If it does, it writes "English" in div, otherwise it writes "Persian". Code:

document.getElementById("give_me_the_lang").addEventListener("keyup", function() {
  if (/^[a-zA-Z]+$/.test(this.value)) {
    document.getElementById("show_lang_in_here").innerHTML = "English";
  } else {
    document.getElementById("show_lang_in_here").innerHTML = "Persian";
  }
});

<input type="text" id="give_me_the_lang">
<div id="show_lang_in_here"></div>

Expression ^[a-zA-Z]+$ only checks the letters of English alphabet, if you write in number or any other character, the result will be "Persian".

Detecting language is a task that a plain if else or switch case won't be able to solve... you got a computer learning problem to solve here my friend.

The good thing is, that there are already crazy geniuses out there that already solved your problem, so why don't use their available solution?

https://cloud.google.com/translate/v2/getting_started#language_detect

1. Signup for the Google Cloud platform
2. Activate the access to the Google Translate API
3. Get a Browser access token for your API. You need this token in order to use it from JavaScript.
4. Now wire up your UI and let them do the magic.

Your HTML will remain the same. Just make sure you also include jQuery.

<input type="text" id="give_me_the_lang" />
<div id="show_lang_in_here"></div>

Now lets wire up the UI

$(function(){

    /* We want to listen to the keypress events from the user 
    *  Each time the user stops typing we wait a few milliseconds and then
    *  we ask Google to detect the language for us */
    var timeoutID;

    /* Replace this with your Google Translate API key */
    var myKey = 'XXXX';

    var detectLanguage = function(){

        $.ajax({
            method: 'GET',
            url: 'https://www.googleapis.com/language/translate/v2/detect',
            data: {
               key: myKey,
               q: $('#give_me_the_lang').val()
            }           
        }).done(function(response){

           /* Push the response to the UI */
           $('#show_lang_in_here').text(JSON.stringify(response.data.detections));
        });        
    };

    $('#give_me_the_lang').on('keyup, keypress, change', function(){
        clearTimeout(timeoutID);

        /* Lets wait half a second */
        setTimeout(detectLanguage, 500);
    });
});

The thing to parse in the response is the array of detections that Google will send back.

{
    "data": {
       "detections": [
         [
           {
            "language": "de",
            "isReliable": false,
            "confidence": 0.049747143
           }
         ]
       ]
    }
}

Which is a perfect example of overly complicated computation result... so, I would say, if the guy gives you one guess, use it, if the guy gives you more, the pick the one you think is the most approximate for your user base (you don;t have customers in North Korea or in Bolivian Quechua territory do you?)

本文标签： javascripthow to detect user39s language while heshe is typingStack Overflow