如何将响应表函数应用到ajax加载的表中？

我有一个小脚本，应用基础响应表的CSS时，屏幕调整大小，它工作得很好。问题是，如果一个表被加载到页面的威盛ajax，该脚本将无法在移动设备上运行，因为屏幕永远不会被调整大小。如何将响应表函数应用到ajax加载的表中？

这里是脚本：

jQuery(document).ready(function() { 


    var switched = false; 
    var updateTables = function() { 
    if ((jQuery(window).width() < 767) && !switched){ 
     console.log('reconfig table'); 
     switched = true; 
     jQuery("table.responsive").each(function(i, element) { 
     splitTable(jQuery(element)); 
     }); 
     jQuery('.scrollable.scroll-right').scrollLeft(10000); 
     return true; 
    } 
    else if (switched && (jQuery(window).width() > 767)) { 
     switched = false; 
     jQuery("table.responsive").each(function(i, element) { 
     unsplitTable(jQuery(element)); 
     }); 
    } 

    jQuery('.scrollable.scroll-right').scrollLeft(10000); 


    }; 

    jQuery(window).load(updateTables); 
    jQuery(window).on("redraw",function(){switched=false;updateTables();}); // An event to listen for 
    jQuery(window).on("resize", updateTables); 


    function splitTable(original) 
    { 
     var wrapperClass = ''; 
     var classnames = jQuery('table.responsive').attr('data-scrollbar-position'); 
     if(classnames == 'left'){ 
     wrapperClass = 'scroll-right'; 
     } 


     original.wrap("<div class='table-wrapper' />"); 

     var copy = original.clone(); 
     copy.find("td:not(:first-child), th:not(:first-child)").css("display", "none"); 
     copy.removeClass("responsive"); 

     original.closest(".table-wrapper").append(copy); 
     copy.wrap("<div class='pinned' />"); 
     original.wrap("<div class='scrollable " + wrapperClass + "' />"); 

    setCellHeights(original, copy); 
    } 

    function unsplitTable(original) { 
    original.closest(".table-wrapper").find(".pinned").remove(); 
    original.unwrap(); 
    original.unwrap(); 
    } 

    function setCellHeights(original, copy) { 
    var tr = original.find('tr'), 
     tr_copy = copy.find('tr'), 
     heights = []; 

    tr.each(function (index) { 
     var self = jQuery(this), 
      tx = self.find('th, td'); 

     tx.each(function() { 
     var height = jQuery(this).outerHeight(true); 
     heights[index] = heights[index] || 0; 
     if (height > heights[index]) heights[index] = height; 
     }); 

    }); 

    tr_copy.each(function (index) { 
     jQuery(this).height(heights[index]); 
    }); 
    } 

});

我怎么能将此移动设备？

来源

2015-11-07 Sean Kimball

当你将使用AJAX的新内容，运行

jQuery(window).resize();

这会触发resize事件，应重绘。

来源

2015-11-07 22:42:36 Streetlamp

如何将响应表函数应用到ajax加载的表中？

回答

相关问题