如何确定Google翻译已加载？

Question

我的页面上有Google翻译.它看起来像一个下拉列表,但我页面上的所有其他下拉列表都有另一种样式.所以我创建了jQuery函数,它改变了Google Translator下拉列表样式.此函数添加或删除一些样式参数.我想知道什么时候应该调用这个函数？在当前的代码中,我在3秒后调用它.在document.ready之后

  $(document).ready(function () {
      setTimeout(wrapGoogleTranslate, 3000);
  });

目前的情况是我隐藏了Google翻译所在的Div,并在我的功能更正其样式后显示它.这意味着我的页面加载,然后等待3秒,然后 Google翻译出现更正的样式.

我想知道如何确定Google Translate下拉列表已加载,然后调用我的函数来更改样式.我不想让用户等待3秒钟(可能在某些情况下谷歌翻译会加载超过3秒,然后我的功能永远不会被执行).

Answer 1

我最近想将"选择语言"更改为"语言",因此我还必须在执行Google代码后运行代码.我是这样做的:

HTML

设置谷歌的这一点很重要div,以display:none-我们将在使用JavaScript褪色它使用户不会看到"选择语言""语言"的文字转换.

<div id="google_translate_element" style="display:none;"></div>
<script type="text/javascript">function googleTranslateElementInit() {new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-35158556-1'}, 'google_translate_element');}</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

JavaScript的

function changeLanguageText() {
  if ($('.goog-te-menu-value span:first-child').text() == "Select Language") {    
    $('.goog-te-menu-value span:first-child').html('Language');
    $('#google_translate_element').fadeIn('slow');
  } else {
    setTimeout(changeLanguageText, 50);
  }
}
changeLanguageText();