首页 > 解决方案 > 如何使用谷歌翻译通过点击更改检测到的语言

问题描述

如何使用谷歌翻译通过点击将语言更改为选定的语言,就像点击“英语文本”然后谷歌自动将页面翻译成英语想要做所有语言(注意:我不希望谷歌翻译元素出现选择语言.我想隐藏选择语言希望,代码有助于理解:

function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en'
  }, 'translator');
}
$(document).ready(function() {
  $("#en").click(function() {
    /*using google translate to auto change language to english*/
  });
  $("#ar").click(function() {
    /*using google translate to auto change language to arabic*/
  });
  $("#ru").click(function() {
    /*using google translate to auto change language to russian*/
  });
  $("#sp").click(function() {
    /*using google translate to auto change language to spanish*/
  });
  $("#fr").click(function() {
    /*using google translate to auto change language to french*/
  });
});
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>M-code</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  <script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
  <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
  <link href="style.css" rel="stylesheet">
</head>
<body>
  <div class="col-md-4" id="translator">
    <hr class="bg-light">
    <h5 class="text-light">Languages</h5>
    <hr class="bg-light">
    <p id="en" class="text-light">English</p>
    <p id="ar" class="text-light">Arabic</p>
    <p id="ru" class="text-light">Russian</p>
    <p id="sp" class="text-light">Spanish</p>
    <p id="fr" class="text-light">French</p>
  </div>
  <script src="script.js" charset="UTF-8"></script>
</body>
</html>

标签: jqueryhtmlgoogle-translate

解决方案


推荐阅读