Question

我一直在使用this jQuery plugin来帮助我与Google翻译API v2进行互动，到目前为止，它一直运行良好。

但是，我想为用户提供撤消翻译的选项，但我看不到任何明显的方法将语言返回其来源（我不想再 - 将字符串翻译回原始语言。）

Answer 1

在翻译内容之前存储已翻译的内容可能是最佳解决方案。既然你还在使用jquery，请看看.html（） - ＆gt; http://api.jquery.com/html/

翻译示例：

var content = $('.element').html();
$('.element').translate();

我认为这是可能的，但您需要对此进行测试：

var content = $('.element').html();
var translated_content = $(content).translate();
$('.element').html(translated_content);

现在回到原文：

$('.element').html(content);

所以请将一些函数和一些事件监听器包装起来并完成工作！

编辑：替代方法

重新考虑上面的原始方法后，认为隐藏原文并添加翻译副本更容易。

注意：使用.clone（）具有生成具有重复id属性的元素的副作用，这些属性应该是唯一的。在可能的情况下，建议避免使用此属性克隆元素或使用类属性作为标识符。

功能：

function translate(object){
   var clone = $(object).clone().addClass("trans_translation"); //copies the object
   $(object).addClass("trans_original"); //adds a identifier to the original
   $(object).after(clone); //inserts the clone to the html
   $(object).next(".trans_translation").translate(); //translate the new div
   $(object).hide(); //hides to original
   $(object).next(".trans_translation").show(); //shows the translation
}

function toggle_translation(bool){
  bool = bool || false; //default parameter
  if(bool){ //if true, show translation, hide original
    $(".trans_translation").show();
    $(".trans_original").hide();
  } else { //if false (default), hide translation, show original
    $(".trans_translation").hide();
    $(".trans_original").show();
  }
}

文件准备好了：

$(document).ready(function(){
  $(".trans_translation").css( "display", "none" ); //hides the translations on default

  //example button to translate a div
  $(".translateme").click(function() {
    var object = $(this).parent(); //selects the parent of the button
    translate(object);
  });

  //example button to hide translated and show original on page
  $(".givemetheoriginal").click(function() {
    toggle_translation();
  });

});

HTML BODY：

<div class=".content">
  <p>This is just a text</p>
  <div class=".translateme">translate this div</div>
</div>
<div class=".content">
  <p>This is just a text</p>
  <div class=".translateme">translate this div</div>
</div>
<div class=".content">
  <p>This is just a text</p>
  <div class=".translateme">translate this div</div>
</div>
<div class=".givemetheoriginal">Show the original!</div>

没有测试过这个，但是假设应该有效。

注意：糟糕，您应首先重命名translate函数，因为translate插件具有相同的名称。

撤消使用Jquery Translate（Google Translate API v2）进行的翻译

1 个答案: