Как перебрать div? - PullRequest
       47

Как перебрать div?

0 голосов
/ 04 декабря 2009

У меня есть следующий сценарий:

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

Я бы хотел взять текст каждого div класса 'msg' и перевести его с помощью Google 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 ..

Спасибо заранее за помощь и время:)

Ответы [ 4 ]

1 голос
/ 04 декабря 2009

Я никогда не играл с 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 голосов
/ 04 декабря 2009

Это может быть связано с тем, что вы неправильно написали язык в строке:

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

Если это не так, вам необходимо предоставить более подробную информацию о происходящем.

0 голосов
/ 04 декабря 2009

Вы уверены, что "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 голосов
/ 04 декабря 2009

попробуй

$(this).html() 

вместо

$(this).text()
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...