使用javascript接受用户在html页面中输入的字符串

时间:2011-08-12 09:46:57

标签: javascript html

我已经制作了一个语言翻译器但是使用java脚本在html页面中翻译了硬编码字符串。我想通过允许用户将字符串输入文本框/文本区域来使其变得灵活,然后我的应用程序可以为用户翻译它。

任何帮助都会很明显:​​)

继承我的代码:(请注意输入您自己的API密钥)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

<script src="http://www.google.com/jsapi?key=YOUR_API_KEY_HERE" type="text/javascript"></script>
    <script type="text/javascript">


    google.load("language", "1");

    function initialize() {
      var content = document.getElementById('content');
      // Setting the text in the div.
      content.innerHTML = '<div id="text">Hola, me alegro mucho de verte.<\/div><div id="translation"/>';

      // Grabbing the text to translate
      var text = document.getElementById("text").innerHTML;

      // Translate from Spanish to English, and have the callback of the request

      google.language.translate(text, 'es', 'en', function(result) {
        var translated = document.getElementById("translation");
        if (result.translation) {
          translated.innerHTML = result.translation;
        }
      });
    }
    google.setOnLoadCallback(initialize);

    </script>
  </head>

  <body style="font-family: Arial;border: 0 none;">
    <div id="content">Loading...</div>
  </body>

</html>

1 个答案:

答案 0 :(得分:1)

您可以使用谷歌翻译api
您可以拨打api并获得翻译版本。请参阅this

把它放在html中

<button type="button" onclick="initialize()">Translate</button>

如果内容是文本框,则在初始化函数中

content.value = "your translated text"

这会在同一个框中更改您的文字