javascript - 无法使 Gtranslate 语言在下拉列表中工作

Question

所以我想在我的网站上使用 Gtranslate.io 语言。我现在正在使用标志，没有任何下拉菜单，一切正常。但现在我想将标志放在下拉列表中。我希望每当有人进入我的网站时默认为英语，但可以从列表中选择一种语言并且该语言将处于事件状态。请检查两个代码笔关于代码:

• > Code which works on my website.
• > Code which doesn't work on my website:

<div class="languages">
                    <a href="#" onclick="doGTranslate('en|en');return false;" title="English" class="gflag nturl" style="background-position:-0px -0px;"><img src="images/english.png" height="16" width="16" alt="English" /></a>
                    <a href="#" onclick="doGTranslate('en|fr');return false;" title="French" class="gflag nturl" style="background-position:-200px -100px;"><img src="images/france.png" height="16" width="16" alt="French" /></a>
                    <a href="#" onclick="doGTranslate('en|de');return false;" title="German" class="gflag nturl" style="background-position:-300px -100px;"><img src="images/germany.png" height="16" width="16" alt="German" /></a>
                    <a href="#" onclick="doGTranslate('en|it');return false;" title="Italian" class="gflag nturl" style="background-position:-600px -100px;"><img src="images/italy.png" height="16" width="16" alt="Italian" /></a>
<div id="google_translate_element2"></div>
</div>

Answer 1

第二个 codepen 不工作因为 div[id="google_translate_element2"]文档中不存在。

将其放置在页面上并更改选择值后，它就可以工作了。我还建议删除 <a>选项中的节点，而不是使用 onchange <select> 上的属性

要小心，更改 Google 的 Logo 和品牌输出可能会违反其 Attribution Requirements

参见 my fork你的代码