有没有办法为您的网站异步加载 Google 翻译小部件?
我尝试将它放在我的页面底部,但#google_translate_element 容器仍然是空的。
<!-- Asynchronous Google Translate -->
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'ar,bg,bn,de,el,eo,es,en,fr,hi,id,it,iw,ja,ko,pl,pt,ru,th,tr,vi,zh-CN', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-1234-1'}, 'google_translate_element');
}
(function() {
var googleTranslateScript = document.createElement('script');
googleTranslateScript.type = 'text/javascript';
googleTranslateScript.async = true;
googleTranslateScript.src = '//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit';
( document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0] ).appendChild( googleTranslateScript );
})();
</script>
最佳答案
看来您的代码中有几个问题。但你的基本想法是正确的。
假设<div id="google_translate_element"></div>
在 script 标签之前定义,以下应该有效:
<!-- Asynchronous Google Translate -->
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'en',
includedLanguages: 'ar,bg,bn,de,el,eo,es,en,fr,hi,id,it,iw,ja,ko,pl,pt,ru,th,tr,vi,zh-CN',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
gaTrack: true, gaId: 'UA-37652767-1'}, 'google_translate_element');
}
var googleTranslateScript = document.createElement('script');
googleTranslateScript.type = 'text/javascript';
googleTranslateScript.async = true;
googleTranslateScript.src = 'http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit';
( document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0] ).appendChild(googleTranslateScript);
</script>
至少当我把它全部放在一个 HTML 文件中并加载到 chrome 时,它对我有用。
当然可以放置 var
$(document).ready
中的声明和后续行函数(或者如果您不使用 jQuery,则以其他方式)。然后div
之间的顺序和 script
将不再重要。
关于javascript - 为您的网站异步加载谷歌翻译小部件的方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15378154/