谷歌翻译组合框显示两次

Question

我在我的网站上使用谷歌翻译。但是，当我在本地主机或ec2实例上运行时，谷歌翻译组合框会显示两次。

这是我的代码。

<div id="google_translate_element" style="position: relative;z-index: 1;"></div> 

<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'en,es,id,ru,tl,zh-TW', 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>

这就是它的样子。知道它出现两次的原因吗？

Answer 1

我确实按原样尝试了这个代码，只看到一个组合框，无论如何你可以尝试删除一个javascript块，看来确实有一个组合框有两个定义

Answer 2

如果您选择翻译网页，然后点击该网页上的链接（定位同一网站），则问题仍然存在。点击链接的页面在屏幕顶部有两个“翻译栏/标题”。对下面原始小部件脚本的简单更改解决了我的问题：

<div id="google_translate_element" style="position: relative;z-index: 1;"></div>
<script type="text/javascript">
var g_gTranslateIsAdded = false;
function googleTranslateElementInit() {
    if (!g_gTranslateIsAdded ) {
        g_gTranslateIsAdded = true;
        new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'en,es,id,ru,tl,zh-TW', 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>