如何通过 html 或 javascript 在 chrome 中打开翻译对话框答案

【问题标题】：how to make open the translation dialog in chrome via html or javascript如何通过 html 或 javascript 在 chrome 中打开翻译对话框
【发布时间】：2019-06-04 01:16:30
【问题描述】：

问题是：是否有可能以更优雅的方式替换旧的“已弃用”https://translate.google.com/intl/en/about/website/

“我们不再提供对 Google 翻译的网站翻译器的新访问权限。此更改不会影响对网站翻译器的现有使用。我们鼓励希望翻译网页的用户使用原生支持翻译的浏览器。”

••• 这段代码带来了一种“选择”的旧风格（对于手机来说不是很酷）

<div id="google_translate_element"></div>
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<script type="text/javascript"> function googleTranslateElementInit() {  new google.translate.TranslateElement({pageLanguage: "en",multilanguagePage: true,layout: google.translate.TranslateElement.InlineLayout.SIMPLE,autoDisplay: false}, "google_translate_element");}</script>

问题是如何创建一个 html 按钮（或可点击的 img）来“询问”谷歌以某种语言打开翻译对话框？？

我想要几个代表不同语言的标志，当用户点击西班牙语标志时，它会触发 chrome 询问用户是否想用西班牙语翻译页面？有没有 javascript 或 html5 的方式来做到这一点？

问候

【问题讨论】：

我还是一头雾水，你想用谷歌翻译 API 创建一个翻译页面吗？
嗨@FahmiJabbar 这是一个老问题。我设法使用了最新的 google API 并制作了自己的语言菜单
你是怎么做到的，@Jintor？
@luislhl 看到我的总结答案（它更准确，更有针对性）旧版本（问题中的那个）让整个网站因为 div 而变得疯狂，span css 并不总是翻译...在此处查看带有 google API 的实时示例：stubfeed.com/feed/12389437059965
@FahmiJabbar 查看我的总结答案

标签： javascript html google-chrome translation google-translate

【解决方案1】：

答案很长，我做一个简短的总结

您需要一个 google API 密钥和能够翻译（这里有一个 google 分步教程：https://neliosoftware.com/blog/how-to-generate-an-api-key-for-google-translate/）
创建一个包含所需语言列表的数组，有关详细信息，请参阅https://cloud.google.com/translate/docs/languages
使用此列表中的选项进行选择
在每个选项上附加一个触发 ajax 函数并将翻译后的文本返回到所需 div 的 onclick

php 函数可能是这样的

$cgoog = 'https://translation.googleapis.com/language/translate/v2?target='.strtolower($langCode).'&key='.GOOGLE_API_KEY_PHP.'&q='.urlencode($text);

$ch = curl_init();
curl_setopt($ch, CURLOPT_HTTPGET,true);
curl_setopt($ch, CURLOPT_URL, $cgoog);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$execurl = curl_exec($ch);
$response = json_decode($execurl, true);

return $response['data']['translations'][0]['translatedText'] ?? '';

注意，双 ??是 php 7 null 合并运算符（简而言之，它是 if !isset 或 else in 1 运算符...）https://www.php.net/manual/en/language.operators.comparison.php#language.operators.comparison.coalesce

【讨论】：