【问题标题】:How to change google translator select language text in coding如何在编码中更改谷歌翻译选择语言文本
【发布时间】:2025-12-14 21:40:02
【问题描述】:

我在我的网站中使用谷歌翻译,我想更改下拉菜单中的选择语言文本。任何人都建议这样做。 这是我的代码;

function googleTranslateElementInit() {
       new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'ar', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
}

提前致谢。

【问题讨论】:

  • 我建议不要更改下拉菜单的文本。而是使用自定义按钮或链接来实现功能。看看这个堆栈线程。 *.com/questions/1565887/…

标签: javascript jquery html google-translate


【解决方案1】:

根据this 问题,您可以根据需要修改元素。

像这样:

<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<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>
  $(document).ready(function(){
    $('#google_translate_element').bind('DOMNodeInserted', function(event) {
      $('.goog-te-menu-value span:first').html('Translate');
      $('.goog-te-menu-frame.skiptranslate').load(function(){
        setTimeout(function(){
          $('.goog-te-menu-frame.skiptranslate').contents().find('.goog-te-menu2-item-selected .text').html('Translate');    
        }, 100);
      });
    });
  });
</script>

http://output.jsbin.com/jucoba

【讨论】:

  • 嗨,谢谢 Mosu.. 它的工作。但是在下拉菜单中,有2个选择语言文本,从您的脚本中更改了第一个,单击下拉后放置的第二个也想更改。
  • 我的荣幸 ;) 祝你好运。
【解决方案2】:

我花了很多时间试图摆脱"RangeError: Maximum call stack size exceeded." 错误。 这是我想出的解决方案。 只需为yourContent 变量分配一个新值,您就可以开始了。 希望有人会觉得这很有帮助。

    var targetElement = document.getElementById("google_translate_element");
    var yourContent = "Your text or <br /> HTML element"
    targetElement.addEventListener("DOMNodeInserted", () => {
      $(".goog-te-menu-value span:first").each(function (i, obj) {
        if (obj.childNodes[0] && obj.childNodes[0].textContent == "Select Language") {
          $(obj).html(yourContent);
        }
      });
    });

另外,如果你想添加图片而不是文本,你需要添加以下 css 来清理不必要的边框:

.goog-te-menu-value span:nth-child(3), 
.goog-te-menu-value span:nth-child(5), 
.goog-te-gadget-icon, 
.goog-te-banner-frame.skiptranslate {
    display:none !important;
  }

div#google_translate_element div.goog-te-gadget-simple {
    border: none;
    background-color: transparent;
}

【讨论】: