2009-12-04 89 views
0

我有以下詩情:如何迭代div?

<div class="maindiv"> 
    <div class="msg">some text</div> 
        ... 
    <div class="msg">some other text</div> 
</div> 

我想借此每個「味精」類的div的文本和使用谷歌API翻譯。

我做了以下JS功能:

function translateTimeline(){ 

var lang = $('#timelineLenguage').val(); 
var translation; 
    $(".msg").each(
    function(i){ 
       translation=google.language.translate($(this).text(), "", lang, 
       function(result) { 
        if (!result.error) { 

         $(this).text(result.translation); 
        }else{ 
         alert('Cannot translate tweet. Try again later'); 
        } 
       }); 

    }); 
return false; 
}; 

這是不工作..

這是所有我可以用我有限的JS/jQuery的技能使..

THX提前爲您的幫助和時間:)

+1

它怎麼不起作用?沒有效果嗎?翻譯錯了?你是否在else塊中得到錯誤信息? – 2009-12-04 14:57:53

回答

1

我從來沒有與google.language APIs發揮,這是一個有趣的練習。基本上它是一個將.msg項目翻譯成另一種語言的工具。我不確定如果API改變會有多脆弱,但它似乎工作得很好。請注意,這不會保留原始文本,所以如果您多次翻譯翻譯質量「降級」。看看我是如何做translateWithGoogle()函數的,我想這會告訴你自己的代碼。我儘可能精簡了它。

<html> 
<head> 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 

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

function translateWithGoogle(context, fromLang, toLang) { 
    google.language.translate($(context).text(), fromLang, toLang, 
     function(result) { 
     if (!result.error) { 
      $(context).text(result.translation); 
     } 
    }); 
} 
function translateTimeline() { 
    var fromLang = $('#currentLang').text(); 
    var toLang = $('#targetLang').val() 
    $('.msg').each(function() { 
     translateWithGoogle(this, fromLang, toLang); 
    }); 
    $('#currentLang').text(toLang); 
} 

$(document).ready(function(){ 
    $('#targetLang').bind('change', function(){ 
     translateTimeline(); 
    }); 
}); 
</script> 
</head> 
<body> 
<div class="maindiv"> 
    <div class="msg">some text</div> 
    <div class="msg">some other text</div> 
    <div class="msg">hello world</div> 
    <div class="msg">my stack has overflowed!</div> 
</div> 
<hr /> 
<span id="currentLang">en</span> 
<select id="targetLang"> 
    <option value="af">Afrikaans</option> 
    <option value="sq">Albanian</option> 
    <option value="ar">Arabic</option> 
    <option value="be">Belarusian</option> 
    <option value="bg">Bulgarian</option> 
    <option value="ca">Catalan</option> 
    <option value="zh-CN">Chinese</option> 
    <option value="hr">Croatian</option> 
    <option value="cs">Czech</option> 
    <option value="da">Danish</option> 
    <option value="nl">Dutch</option> 
    <option value="en">English</option> 
    <option value="et">Estonian</option> 
    <option value="tl">Filipino</option> 
    <option value="fi">Finnish</option> 
    <option value="fr">French</option> 
    <option value="gl">Galician</option> 
    <option value="de">German</option> 
    <option value="el">Greek</option> 
    <option value="iw">Hebrew</option> 
    <option value="hi">Hindi</option> 
    <option value="hu">Hungarian</option> 
    <option value="is">Icelandic</option> 
    <option value="id">Indonesian</option> 
    <option value="ga">Irish</option> 
    <option value="it">Italian</option> 
    <option value="ja">Japanese</option> 
    <option value="ko">Korean</option> 
    <option value="lv">Latvian</option> 
    <option value="lt">Lithuanian</option> 
    <option value="mk">Macedonian</option> 
    <option value="ms">Malay</option> 
    <option value="mt">Maltese</option> 
    <option value="no">Norwegian</option> 
    <option value="fa">Persian</option> 
    <option value="pl">Polish</option> 
    <option value="pt">Portuguese</option> 
    <option value="ro">Romanian</option> 
    <option value="ru">Russian</option> 
    <option value="sr">Serbian</option> 
    <option value="sk">Slovak</option> 
    <option value="sl">Slovenian</option> 
    <option value="es">Spanish</option> 
    <option value="sw">Swahili</option> 
    <option value="sv">Swedish</option> 
    <option value="th">Thai</option> 
    <option value="tr">Turkish</option> 
    <option value="uk">Ukrainian</option> 
    <option value="vi">Vietnamese</option> 
    <option value="cy">Welsh</option> 
    <option value="yi">Yiddish</option> 
</select> 

</body> 
</html> 
+0

工作奇蹟!thx很多!:) – mcabral 2009-12-04 17:58:46

+0

就像我說的,這是一個很好的練習 - 我很樂意幫助! – artlung 2009-12-04 18:12:22

0

myabe嘗試

$(this).html() 

代替

$(this).text() 
+0

text()在這裏是合適的方法。谷歌translater是不感興趣的任何HTML標籤。 – Magnar 2009-12-04 15:26:19

+0

已經嘗試過這一個,同樣的問題:(感謝您的輸入:) – mcabral 2009-12-04 17:58:04

0

這可能是因爲你拼寫的語言錯行:

lang = $('#timelineLenguage').val(); 

如果不是它,你需要提供關於正在發生的事情的更多細節。

+0

感謝您的答案。是的,那裏有一個錯字,但那不是:( – mcabral 2009-12-04 17:57:25

0

您確定下面一行中的「this」指向正確的對象嗎?它不是指向窗口嗎?

$(this).text(result.translation); 

試試這個:

function translateTimeline(){ 

    var lang = $('#timelineLenguage').val(); 
    var translation; 
    $(".msg").each(
    function(i){ 
     var me = this; /*CHANGED*/ 
     translation=google.language.translate($(this).text(), "", lang, 
      function(result) { 
       if (!result.error) { 
        $(me).text(result.translation); /*CHANGED*/ 
       }else{ 
        alert('Cannot translate tweet. Try again later'); 
       } 
      } 
     ); 
    }); 
    return false; 
}; 
+0

複製和粘貼,但沒有運氣:( thx你的時間:) – mcabral 2009-12-04 17:59:54

+0

對不起,它沒有工作 – 2009-12-07 14:36:23