Использование якоря после добавления с помощью jquery html

Question

Это два вопроса в одном действительно ...

Во-первых, у меня есть список «билетов». Каждый билет имеет уникальный идентификатор, который я использую для идентификации элемента. Существует возможность щелкнуть («a.showMore»), чтобы просмотреть дополнительную информацию о «билете». Когда это щелкнуто, я использую jquery.append, чтобы добавить опцию, чтобы закрыть эту дополнительную информацию и сместить дополнительную информацию. Проблема с закрытием. Если я жестко кодирую a.closeMore, он работает, но ничего не происходит, если я использую append. Любые идеи о том, что я делаю неправильно?

Код:

$(document).ready(function(){ 
$('.moreInfo').hide(); //hide the extra info on page load 

//Show more information when a.showMore is clicked 
$('.showMore').click(function(){ 
    var ticketNumber=$(this).attr("id"); 
    var id="#more_"+ticketNumber; 
    $('p.options').append(' or <a id="'+ticketNumber+'" class="closeMore">close more info</a></p>');//Add close option to p.options 
    $(id).slideDown(); //slide the extra info down 
}); 


//close more information 
$('.closeMore').click(function(){ 
    var id="#more_"+$(this).attr("id"); 
    $(id).slideUp(); 
}); 

}); 

Во-вторых, мой 'нажмите здесь' ссылка работает только один раз на странице. Любые идеи о том, как я могу заставить его работать на все элементы в списке (каждый элемент списка имеет уникальный идентификатор, но один и тот же класс (a.showMore) и заставить его работать каждый раз, когда он щелкнул?

Спасибо!

Answer 1

Попробуйте использовать обработчики live(), которые позволят обработчику кликов применять любые элементы на странице независимо от того, когда они будут добавлены. Если вы не используете live-обработчики, вам нужно будет применить обработчик к любым элементам, добавленным в страницы, поскольку они добавлены, поскольку эти элементы не существовали при применении оригинальных обработчиков и, следовательно, не имеют обработчика, подключенного к ним.

$('.closeMore').live('click', function(){ 
    var id="#more_"+$(this).attr("id"); 
    $(id).slideUp(); 
});