Google Translate Widget - 翻译完整回调

Question

我使用以下谷歌提供的代码在我的一个网站上使用谷歌翻译小部件:

<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

<script>

我的问题:翻译在页面加载后运行,但我也有一个脚本,根据宽度自动调整主要导航元素的大小.

这在翻译完成之前运行,因此它会根据未翻译的英文标签进行调整.一旦翻译改变了导航措辞,导航元素需要调整大小以适应新翻译的单词,因为它们可能与英语的大小(宽度)不同.

在运行代码以调整主导航大小之前,我已尝试调用Google翻译代码,但翻译以异步方式运行,因此我的代码在翻译完成之前运行.

翻译完成时是否会引发回调事件(或某种方式来检测翻译何时完成),所以我可以在尝试调整导航大小之前等待？

此外,我需要在页面完成翻译后运行脚本.

Answer 1

这是我最终使用的修复:

jQuery(function(){
    firstMenu = $("#nav li:first").text();

    setTimeout(waitNav, 500);
});

function waitNav() {

    if (firstMenu != $('#nav li:first').text()) {

        initNav();
        firstMenu = $('#nav li:first').text();
        setTimeout(waitNav, 500);

    }
    else {
        setTimeout(waitNav, 500);
    }

}

基本上,继续检查已知文本是否已更改(在这种情况下,它是导航块中的第一项).

如果它已经改变意味着翻译器已经运行,那么运行翻译后需要运行的代码(这里是initNav()).

在用户选择其他语言的情况下,我会不断检查更改.

它并不完美,但它对我有用:-)