Замена текста в Toggled Anchor с помощью JQuery

Question

Я пытаюсь изменить текст в привязке при переключении. Я делаю это в данный момент, но обнаружил, что после замены анкерной метки переключение перестает работать. Может кто-нибудь объяснить, почему это происходит и какое решение? Большое спасибо.

$('a#toggleHeader').toggle(function() { 
    $('#header-wrapper').slideUp(); 
    $(this).replaceWith('< href=\"#\" id="toggleHeader">Show Header</>'); 

// Примечание: Я переместить якорь, потому что я могу только размещать один якорь в качестве нового пользователя

},function(){ 
    $('#header-wrapper').slideDown(); 
    $(this).replaceWith('<a href=\"#\" id="toggleHeader">Hide Header</a>'); 

}); 

Answer 1

Просто измените содержимое якоря, вместо того, чтобы заменить все это:

$('a#toggleHeader').toggle(function() { 
    $('#header-wrapper').slideUp(); 
    $(this).text('Show Header'); 
}, function() { 
    $('#header-wrapper').slideDown(); 
    $(this).text('Hide Header'); 
}); 

причина, почему он больше не работает, потому, что обработчики событий были потеряны, когда якорь удаляется (и заменить). Если вы хотите, чтобы ваш пример работал, вам нужно было либо переустанавливать события каждый раз, когда они были заменены, либо связывать события с использованием методовили delegate().