Google API - Translate a string into EN language :(
I am trying to make a simple web based application which will translate a non-english (non-EN) string into English (EN) language. For this I am using Google's Translation API (v1- JS).
At first I am detecting the language provided in a div tag (note that page encoding is set to UTF-8).
Then I am trying to translate the text if it is in non EN language and then it is to be displayed just below the detected language tag.
I am able to obtain the language detected but the translation never happens! :(
Any help would be much appreciated..
Here's the code:
<!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=utf-8">
<title>Insert title here</title>
<script
src="http://www.google.com/jsapi?key=mykeyfrxwexdfwezfdhfxcewx" type="text/javascript"></script>
<script type="text/javascript">
/*
* How to detect the language of text.
*/
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="detected"><\/div><div id="transtext"/>';
// Grabbing the text to translate
var text = document.getElementById("text").innerHTML;
// Detect the language of the text.
google.language.detect(text, function(result) {
var detected = document.getElementById("detected");
// If there wasn't an error in the request
if (!result.error) {
var langCode = result.language;
var langName;
// Loop through the languages enum so that we can find the actual name of the language.
// Learn about the languages enum here:
// http://code.google.com/apis/ajaxlanguage/documentation/reference.html#LangNameArray
for ( var i in google.language.Languages) {
var thisLangCode = google.language.Languages[i];
if (thisLangCode == langCode) {
// find the language code, store the language name.
langName = i;
break;
}
}
// See the detected language.
detected.innerHTML = 'Detected: "' + result.language
+ '" - aka "' + langName + '"';
}
});
google.language.translate(text, 'es',开发者_运维百科 'en', function(result) {
var translated = document.getElementById("transtext");
if (result.transtext) {
translated.innerHTML = result.transtext;
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body style="font-family: Arial; border: 0 none;">
<div id="content">Loading...</div>
</body>
</html>
3 points to note .
You are not actually calling translate within the callback of detect. The translate result does not contain a property transtext . The one you need is named translation . I doubt you want to post your API key in a public domain
Find modified code below
<!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=utf-8">
<title>Insert title here</title>
<script
src="http://www.google.com/jsapi?key=xxxxxxxxxxxxxxx>" type="text/javascript"></script>
<script type="text/javascript">
/*
* How to detect the language of text.
*/
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="detected"><\/div><div id="transtext"/>';
// Grabbing the text to translate
var text = document.getElementById("text").innerHTML;
// Detect the language of the text.
google.language.detect(text, function(result) {
var detected = document.getElementById("detected");
// If there wasn't an error in the request
if (!result.error) {
var langCode = result.language;
var langName;
// Loop through the languages enum so that we can find the actual name of the language.
// Learn about the languages enum here:
// http://code.google.com/apis/ajaxlanguage/documentation/reference.html#LangNameArray
for ( var i in google.language.Languages) {
var thisLangCode = google.language.Languages[i];
if (thisLangCode == langCode) {
// find the language code, store the language name.
langName = i;
break;
}
}
// See the detected language.
detected.innerHTML = 'Detected: "' + result.language
+ '" - aka "' + langName + '"';
google.language.translate(text, result.language, 'en', function(result) {
var translated = document.getElementById("transtext");
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>
加载中,请稍侯......
精彩评论