我在选项卡中有一个页面工作正常,但它有一个分页,我创建了一个ajax来加载其他选项卡。但点击按钮后,选项卡不起作用
这是我创建选项卡的函数。
var tabContainers = $('.messages');
var navTab = $('div.list ul.nav li');
function loadPage() {
$(document).on('click', navTab, function(){
var the_hash = $(this).children().attr('href');
tabContainers.hide().filter(the_hash).show();
$('div.list ul.nav li').removeClass('active');
$(this).addClass('active');
return false;
}).filter(':first').click();
};
这是我的 ajax 调用
//button
var moreConversations = $('.btn-more-conversations');
// more conversations
moreConversations.click(function(){
var currentPage = $(this).attr('current-page'),
totalPages = parseInt($(this).attr('total-pages')),
nextPage = parseInt(currentPage) + 1;
$.ajax({
type: "GET",
url: "/inbox/" + nextPage
}).done( function(data){
if (nextPage == totalPages) {
moreConversations.remove();
}else{
moreConversations.attr('current-page', nextPage);
}
insertConversations(data);
}).fail( function(){
sweetAlert("Oops...", "Erro ao aplicar a paginação", "error");
});
});
function insertConversations(page) {
var content_nav = $(page).find('div.menu-conversations').html();
var content_conv = $(page).find('div.content-conversations').html();
$('div.menu-conversations').append(content_nav);
$('div.content-conversations').append(content_conv);
}
我忘记了什么?谢谢!!!
最佳答案
使用.on()
方法而不是.click()
。由于您在运行时附加 li
,因此它不会将 .click()
事件附加到 future 的 li
。因此,在这种情况下,您可以使用 .on()
方法。
function loadPage() {
$(document).on('click', 'div.list ul.nav li' function () {
var the_hash = $(this).children().attr('href');
tabContainers.hide().filter(the_hash).show();
$('div.list ul.nav li').removeClass('active');
$(this).addClass('active');
return false;
}).filter(':first').click();
};
关于javascript - ajax 调用后选项卡不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40763360/