的Javascript tablesort不適合動態表

工作，這是我的html文件：的Javascript tablesort不適合動態表

<html> 
<head> 
     <script type="text/javascript" src="script.js"></script> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
     <script type="text/javascript" src="http://tablesorter.ru/jquery.tablesorter.min.js"></script> 
     <script type="text/javascript" src="http://tablesorter.ru/addons/pager/jquery.tablesorter.pager.js"></script> 
     <script type="text/javascript"> 
     $(document).ready(function() 
     { 
     $("#excelDataTable1").tablesorter(); 
     } 
     ); 
     </script> 

</head> 
<body onLoad="main()"> 
    <table id="excelDataTable" border="1" class="tablesorter"> 
    </table> 

</body> 
</html>

這是的script.js

var myList=[{"Идентификатор" : "1", "Название" : "Iphone","Стоимость":"500","Количество":"5"}, 
     {"Идентификатор" : "2", "Название" : "XBOX","Стоимость":"300","Количество":"7"}, 
     {"Идентификатор" : "3", "Название" : "XBOX","Стоимость":"400","Количество":"7"}]; 
function buildHtmlTable() { 
var columns = addAllColumnHeaders(myList); 

for (var i = 0 ; i < myList.length ; i++) { 
    var row$ = $('<tr/>'); 
    for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) { 
     var cellValue = myList[i][columns[colIndex]]; 

     if (cellValue == null) { cellValue = ""; } 

     row$.append($('<td/>').html(cellValue)); 
    } 
    $("#excelDataTable").append(row$); 
} 

    $("#excelDataTable").append($('<tbody/>'));} 
function addAllColumnHeaders(myList) 
{ 
var columnSet = []; 
var headerTr$ = $('<tr/>'); 

    var rowHash = myList[0]; 
    for (var key in rowHash) { 

     if ($.inArray(key, columnSet) == -1){ 
      headerTr$.append($('<th/>').html(key)); 
      columnSet.push(key); 
     } 
    } 
$("#excelDataTable").append($('<thead/>').html(headerTr$)); 
alert(columnSet); 
return columnSet;} 
    function main(){ 
buildHtmlTable();}

我用的jQuery tablesort給我excelDataTable排序。當我使用生成的表格代碼並粘貼到html時，它工作正常，但在使用動態表格時它不起作用。

來源

2014-10-30 Magzhan Zhaksygeldi

在將表格附加到DOM後，您應該調用tablesorter插件。調用它，表格可能還沒有創建。 – 2014-10-30 18:15:11

每上面我的意見，你可以試試這個：

$(document).ready(function() { 
    $.when(main()).done(function() { 
    $("#excelDataTable1").tablesorter(); 
    }); 
});

信息在這裏when方法：http://api.jquery.com/jQuery.when/

基本上，這樣可以確保您的main()函數執行tablesorter插件之前完成。

來源

2014-10-30 18:18:47

ha :) 謝謝）那麼容易 – 2014-10-30 18:25:22

如果有幫助請標記爲答案。謝謝！ – 2014-10-30 18:26:59

但是..一件事添加此代碼後，我的表格有重複的行 – 2014-10-30 18:32:20

的Javascript tablesort不適合動態表

回答

相關問題