Проблемы с поиском / ближайшим

ОБНОВЛЕНИЕ 1:

Возникает ли у меня эта проблема из-за того, что я удаляю .BC1 до того, как get_firm_summary(); сможет ее использовать?

ОРИГИНАЛЬНЫЙ ВОПРОС:

Я начал этот вопрос снова, так как он не был хорошо структурирован и вызывал много путаницы.

Прежде чем начать, я хотел бы отметить, что использую jQuery 1.4.

У меня есть функция, в которой я динамически создаю тег span в некотором HTML, где тег span выглядит примерно так:

<span class='BC1'>some text here</span>

HTML-код перед вставкой .BC1 выглядит так:

<div class="portlet_10">
    <div class="portlet_header_10"></div>
    <div class="portlet_sub_header_10">this is where the span gets inserted</div>
    <div class="portlet_content_10">this is the bit which should get cleared and appended with new data</div>
    <div class="portlet_footer_10"></div>
<div>

И это выглядит так после вставки .BC1:

<div class="portlet_10">
    <div class="portlet_header_10"></div>
    <div class="portlet_sub_header_10"><span class="BC1">some text here</span></div>
    <div class="portlet_content_10">this is the bit which should get cleared and appended with new data</div>
    <div class="portlet_footer_10"></div>
<div>

Затем у меня есть событие click для этого тега .BC1:

$('.BC1').live('click', function() {
    alert("clicked");
    $(this).closest('.portlet_10').find('.portlet_sub_header_10').empty();  
    get_firm_summary( $(this) );
});

Предупреждение, поиск ближайшего portlet_sub_header_10 и установка empty(); работают, а вставленный .BC1 исчезает. У меня проблема с get_firm_summary( $(this) );

Функция выглядит примерно так:

function get_firm_summary( that ) {
    $.ajax({
        url: 'get_firm_summary.aspx?rand=' + Math.random(),
        type: 'GET',
        error: function(xhr, status, error) {
            console.log(status);
            console.log(xhr.responseText);
        },
        success: function(results) { 
            console.log( that.attr("class") );
            that.closest('.portlet_10').find('.portlet_content_10').empty().append( results );
        }
    });
}

Здесь console.log работает нормально, но с portlet_content_10 ничего не происходит.

Кто-нибудь знает, почему это происходит?


person oshirowanen    schedule 29.05.2012    source источник
comment
у вас portlet_content_10 пусто или вообще не меняется?   -  person mgraph    schedule 29.05.2012
comment
@mgraph, в portlet_content_10 вообще ничего не меняется, поэтому он не очищается и не изменяется.   -  person oshirowanen    schedule 29.05.2012
comment
@mgraph, как мне проверить трассировку (результаты), я никогда раньше этим не пользовался.   -  person oshirowanen    schedule 29.05.2012
comment
извините, я имею в виду, что console.log(results); trace предназначен для флэш-памяти   -  person mgraph    schedule 29.05.2012
comment
@mgraph, console.log( results ); возвращает все, что я хочу вставить в .portlet_content_10.   -  person oshirowanen    schedule 29.05.2012


Ответы (2)


Проблема в том, что перед вызовом get_firm_summary( $(this) ); вы вызываете empty() в родительском div элемента, по которому был выполнен щелчок. При этом теряется ссылка на элемент в DOM, что делает невозможным выполнение каких-либо функций обхода.

Попробуй это:

$('.BC1').live('click', function() {
    get_firm_summary( $(this) );
});

// ajax:
success: function(results) {
    // add new text
    that.closest('.portlet_10').find('.portlet_content_10').empty().append("FOO BAR");

    // remove clicked element
    that.closest('.portlet_10').find('.portlet_sub_header_10').empty();  
}

См. Эту скрипку для получения рабочего примера.

person Rory McCrossan    schedule 29.05.2012
comment
То есть удаление тега span слишком рано. Спасибо. - person oshirowanen; 29.05.2012

Попробуйте это для лучшего решения

$('.BC1').live('click', function() {
    alert("clicked");
    get_firm_summary( $(this) );
    $(this).closest('.portlet_10').find('.portlet_sub_header_10').empty();  

});
person kongaraju    schedule 29.05.2012