通过AJAX实现CSS选项卡内容

Question

是否有一种方法可以通过ajax上的ajax上的css tabs加载选项卡的内容，类似于jquery ui？https://jqueryui.com/tabs/#ajax

Answer 1

您可以使用jQuery UI选项卡，然后遵循

$( function() {
    $( "#tabs" ).tabs({
      beforeLoad: function( event, ui ) {
        ui.jqXHR.fail(function() {
          ui.panel.html(
            "Couldn't load this tab. We'll try to fix this as soon as possible. " +
            "If this wouldn't be a demo." );
        });

确保在物质化的CSS中包含"选项卡ID"，并在物质化CSS之前先于脚本选项卡。

Answer 2

您可以滚动自己的ajax请求，然后以这样的标签为目标：

$(document).on('click', '.tab', (function(e){
    var url = $(this).find('a').attr('href');
    e.preventDefault();
    $.ajax({
        type: "GET",
        url: url,
        data: { },
        success: function(data){
            $('#targetElement').html(data);
        }
    });
});