1

ユーザーが Web ページのボタンをクリックしたときに、Microsoft トランスレータ API と AJAX 呼び出しを使用して、段落を英語からスペイン語に翻訳することができました。スペイン語のテキストを英語に翻訳し直さなくても、元のテキストに切り替えることができるようにしたいと考えています。ページのソースを表示すると元のテキストが表示されますが、それをユーザーに表示する方法がわかりません。

function Translate()
{
  var from = "en", to = "es", text = $('.Translate').text();
  
  var s = document.createElement("script");
  s.src = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate" +
      "?appId=Bearer " + encodeURIComponent(window.accessToken) +
      "&from=" + encodeURIComponent(from) +
      "&to=" + encodeURIComponent(to) +
      "&text=" + encodeURIComponent(text) +
      "&oncomplete=MyCallback";
  document.body.appendChild(s);
}

function MyCallback(response)
{
  $('.Translate').text(response);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btnTranslate" onclick="Translate()" class="etsButton">Translate</button>
<button id="btnRestore" onclick="Restore()" class="etsButton">Restore</button>

<div style="padding:10px;" class="Translate">
To be, or not to be: that is the question:
Whether 'tis nobler in the mind to suffer
The slings and arrows of outrageous fortune,
Or to take arms against a sea of troubles,
And by opposing end them? 
</div>

4

2 に答える 2

2

ページ ソースを表示しても、ページの現在の HTML は表示されません。問題は、あなたの行$('.Translate').text(response);があなたのページにあった元のテキストを破壊することです.

元に戻せるようにしたい場合は、翻訳されたテキストを新しい div に入れる必要があります。次に、div を表示および非表示にして、表示されたバージョンを切り替えることができます。

于 2015-09-09T21:16:13.927 に答える
1

元のテキストを変数に格納することで翻訳する前に覚えておくことができ、関数内でこの変数の内容にrestore()置き換えることができます。textただし、この一時変数はさまざまな関数で値を設定および取得する必要があるため、より高いスコープにある必要があります。あなたの場合、それはグローバルなものになりますが、それは推奨されないことに注意してください.

var originalText; 

function Translate()
{
  var from = "en", to = "es", text = $('.Translate').text();

  originalText = text;

  var s = document.createElement("script");
  s.src = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate" +
      "?appId=Bearer " + encodeURIComponent(window.accessToken) +
      "&from=" + encodeURIComponent(from) +
      "&to=" + encodeURIComponent(to) +
      "&text=" + encodeURIComponent(text) +
      "&oncomplete=MyCallback";
  document.body.appendChild(s);
}

function restore(){
   $('.Translate').text(originalText);
}
于 2015-09-09T21:16:40.700 に答える