Как динамически менять язык в Google Transliterate?

Я столкнулся с проблемой здесь, прошло почти день. У меня есть поле выбора языка и текстовое поле.

вот HTML:

<select id="language" class="form-control">
    <option id="1">HINDI</option>
    <option id="2">KANNADA</option>
    <option id="3">BANGLA</option>
</select>
<textarea class="form-control" type="text" id="TextArea" maxlength ="500" placeholder="Enter text here..."></textarea>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

И сценарий здесь:

// Load the Google Transliterate API
google.load("elements", "1", {
    packages: "transliteration"
});

var language = $('#language option:selected').val().toUpperCase();

function onLoad() {
    debugger;
    var options = {
         sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
         destinationLanguage:[google.elements.transliteration.LanguageCode[language]],
         shortcutKey: 'ctrl+g',
         transliterationEnabled: true
    };
    var control = new google.elements.transliteration.TransliterationControl(options);
    control.makeTransliteratable(['TextArea']);
}

google.setOnLoadCallback(onLoad);

//change the language on dropdown change
$('#language').on('change', function(event){
    debugger;
    language = $(this,':selected').val().toUpperCase();
    google.setOnLoadCallback(onLoad);
});

Проблема здесь в том, что при этом не возникает никаких ошибок. API транслитерации тоже не работает.

Для одного языка, когда он был статичным, работает как шарм.


javascript jquery google-api transliteration
person Prashanth Benny    schedule 21.09.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Есть специальная функция, которая обрабатывает смену языка в Google Transliterate API.

Вот код

<select id="language" class="form-control">
    <option id="1">HINDI</option>
    <option id="2">KANNADA</option>
    <option id="3">BANGLA</option>
</select>
<textarea class="form-control" type="text" id="TextArea" maxlength ="500" placeholder="Enter text here..."></textarea>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

Код JS:

// Load the Google Transliterate API
google.load("elements", "1", {
    packages: "transliteration"
});

var language = $('#language option:selected').val().toUpperCase();
var control;

function onLoad() {
    var options = {
         sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
         destinationLanguage:[google.elements.transliteration.LanguageCode[language]],
         shortcutKey: 'ctrl+g',
         transliterationEnabled: true
    };
    control = new google.elements.transliteration.TransliterationControl(options);
    control.makeTransliteratable(['TextArea']);
}

google.setOnLoadCallback(onLoad);

//change the language on dropdown change
$('#language').on('change', function(event){
    language = $(this,':selected').val().toUpperCase();

    //function to change the language dynamically(Google API)
    control.setLanguagePair(
        google.elements.transliteration.LanguageCode.ENGLISH,
        google.elements.transliteration.LanguageCode[language]);
});

Надеюсь, это поможет.
Спасибо!

person Prashanth Benny    schedule 07.11.2018