JQuery "кэширует" элементы DOM?Или это Хром?

Question

Я пишу небольшое расширение Chrome для управления DOM результатов поиска Google, чтобы добавить небольшой набор вопросов, чтобы спросить пользователя, почему он / она решил перейти по этой ссылке; во время полировки я решил осмотреть страницу в случае, если уже был показан старый опрос, чтобы удалить его (например, если пользователь решил следовать другому результату после того, как он / она нажал на него), и тогда я начал замечать странное поведение: в первый раз, когда я нажал на ссылку, я представил опрос, прежде чем смог перейти на выбранную страницу; во второй раз (не покидая страницы) старый опрос корректно удалялся, а новый добавлялся в DOM, но этот новый элемент становился нацеленным на slideDown(), только если он был вставлен до старого ( т.е. если я нажал на ссылку выше предыдущей).

$('li.g a') // all the results' link
    .bind('click', function(event) {
        event.preventDefault(); // avoid going to destination right away

        var oldpoll = $('#extension');
        if (oldpoll.length)
            oldpoll.slideUp('fast', function(){
                                    $(this).remove();
                                }); // remove (eventual) old poll
        ...

        $(this).parents('.g').append(element);
        $('#extension').slideDown();
    });

Как вы можете видеть, я подумал, что происходит какое-то кэширование, и попытался "принудительно" избежать его, объявив переменную для хранения старого элемента, но это не сработало; в конце концов мне удалось обойти это, форсировав новый обход DOM с помощью $('#extension a').parent().slideDown();, но теперь мне действительно любопытно, виновата ли я в этом, Chrome или JQuery. Благодаря.

Answer 1

Я думаю, что проблема, вероятно, в том, что вы вставляете несколько элементов с идентификатором 'extension'.Предполагается, что идентификаторы в документе должны быть уникальными, но во время работы slideUp будет два элемента "#extension".

Из-за этого, если вы вставите его выше старого и затем запуститеslideDown, он попытается выполнить его на новом, но если вы вставите его после старого элемента, то ваш слайддон будет запущен на старом, потому что $ ('# extension') возьмет первое с этим идентификатором встр.

Answer 2

Как сказано в приведенном выше комментарии, при использовании .bind () встречается немало недоразумений:

http://api.jquery.com/bind/

, поэтому я определенно рекомендую использовать .live () (также не рекомендуется ...) или новый .on ()