通過動態生成的按鈕加載jQuery Ajax的內容

我正在使用這個動態生成一些按鈕的小提琴http://jsfiddle.net/wNDaG/中的代碼。不過，我想要做的是讓每個按鈕都通過ajax執行加載某些內容（將其附加到div）的功能。通過動態生成的按鈕加載jQuery Ajax的內容

下面是從小提琴代碼：

$('#tabs div').first().attr('class', 'current'); 

$('#tabs div').each(function(i) { 
    i = i + 1; 

$(this).attr('id', 'tab-' + i); 

    if(i !== $('#tabs div').size()) { 
    $(this).append('<button class="tabPagination" rel="tab-' + (i + 1) + '">Next</button>'); 
} 
    if(i !== 1) { 
    $(this).append('<button class="tabPagination" rel="tab-' + (i - 1) + '">Previous</button>'); 
    }     
});    

$('#tabs div[class!="current"]').hide(); 

$('.tabPagination').live('click', function() { 
    $('.current').removeAttr('class'); 
    $('#tabs div[class!="current"]').hide(); 
    $('#' + $(this).attr('rel')).show(); 
});

作爲一個開始，我會做的第一件事是增加一些像這樣的附加按鈕：

href="some-content/next-pagenum_' + (i + 1) + '"

這是哪裏後我需要幫助，以結合如下功能，通過ajax添加內容：

$('.tabPagination').live('click', function(event) { 
    var url = $(this).attr('href'); 
$('#content-target-div').load(url); // load the html into your chosen DOM element 
    event.preventDefault(); // prevent the browser from navigating to this page 

    return false; 
});

在這裏的任何幫助將不勝感激。提前致謝！

來源

2013-04-03 vibe9

最簡單的方法是做到以下幾點：

$.get(url, function(content) { 
    $('#content-target-div').append(content); 
});

代替

來源

2013-04-03 23:17:19

感謝您的反饋安東尼。我是一個JS新手，所以原諒我問明顯，但是這個代碼會取代那一行或整個函數？ – vibe9 2013-04-03 23:32:04

見上 - 我已經回答了這個問題。謝謝！ – vibe9 2013-04-05 18:11:01

我設法使用下面的代碼來解決這個問題：

$(document).on("click", ".tabPagination", function(){ 
    var link = $(this).attr('href'); 

    $('#ajaxcontent').fadeOut('fast', function() { 
     $.get(
      link +' #ajaxcontent', 
      function(data) { 
       $("#ajaxcontent").html(data).fadeIn('fast'); 
      }, 
      "html" 
     ); 
    }); 
    return false; 
});

注意我'm不使用.live（），here's why，而是使用.on（）代替。

來源

2013-04-05 06:13:06 vibe9

通過動態生成的按鈕加載jQuery Ajax的內容

回答

相關問題