проблема выбора jquery - PullRequest
Новая
       23

проблема выбора jquery

0 голосов
/ 14 октября 2010

У меня есть div, который в готовом документе jquery я добавляю - используя синтаксис $("#div id").append('html text') - с 10 или более дочерними элементами div.

как только это будет сделано, я пытаюсь проверить содержимое дочерних элементов div с помощью alert($(".classname")); и возвращается: 

function(a){if(c.isFunction(a))return this.each(function(b){var d=c(this);d.text(a.call(this,b,d.text()))});if(typeof a!=="object"&&a!==w)return this.empty().append((this[0]&&this[0].ownerDocument||s).createTextNode(a));return c.text(this)}

Я ожидал бы, что это предупредит с содержанием html дочерних элементов div, а не javascript?

полный скрипт: 

<script type="text/javascript">
    $(document).ready(function(){

        // twitter api's base url
        var url="http://search.twitter.com/search.json?callback=?&result_type=recent&q=";
        // we'll store the search term here
        var query = "blah";
        // get the json file
        $.getJSON(url+query,function(json){
            // this is where we can loop through the results in the json object
            $.each(json.results,function(i,tweet){
                // this is where we do what we want with each tweet
                $("#results").append('<div class="tweetBox"><span class="unseen">'+tweet.created_at+'</span><div class="tweetImg"><img src="'+tweet.profile_image_url+'" width="48" height="48" /><a class="overbox" href="http://twitter.com/'+tweet.from_user+'/status/'+tweet.id+'"></a></div>'+tweet.text+' ...said '+((new Date().getTime()/1000/60)-(new Date(tweet.created_at))/1000/60).toFixed(0)+' minutes ago</div>');

            });
        });

        $("#results").height(function(){return $(window).height()-204;});
        alert($(".unseen").html());     
    });
</script>

<div id="results"></div>

Обновление: безусловно, здесь происходит какое-то состояние гонки jquery / javascript, если я заменим предупреждение на setTimeout(function(){alert($(".unseen").html());},1000);, оно вернет ожидаемый текст. Если я изменил паузу тайм-аута на 1 миллисекунду, он снова вернет null.

Не уверен, что существует «реальный» обходной путь для этого, кроме как придерживаться задержки?

Ответы [ 2 ]

1 голос
/ 14 октября 2010

Ajax-вызовы (например, $.getJSON) выполняются асинхронно.

Это означает, что когда выбор jQuery сделан (в нижней части скрипта), ответ может быть еще не получен (все еще в пути).

Вы должны переместить весь код, который зависит от элементов, созданных из ответа в функции обратного вызова (сразу после $.each(...);)

Ex: 

$.getJSON(url+query,function(json){
    // this is where we can loop through the results in the json object
    $.each(json.results,function(i,tweet){
        // this is where we do what we want with each tweet
        $("#results").append('<p>this element is created only when the callback is triggered</p>');
    });
    // do stuff here with all your created elements
    alert('found '+$(".unseen").length+' objects');
});

Также обратите внимание, что функция html () возвращает html-содержимое только первого элемента в наборе.

РЕДАКТИРОВАТЬ: ваш трюк тайм-аута работает, потому что он дает ajax-вызову время, необходимое для завершения, и вызывает функцию обратного вызова, которая рекламирует объекты в DOM. См. Рабочий пример здесь .

0 голосов
/ 14 октября 2010

Попробуйте 

alert($('.classname').html());

Я не понимаю, почему он вернул функциональный текст; Вы уверены, что у вас был $('.classname') в вашем alert() звонке? Может быть, у вас было $('.classname').html без финала ()?

...