Javascript表排序不'；不适用于动态表_Javascript_Jquery_Html

Javascript表排序不'；不适用于动态表

javascript jquery html

Javascript表排序不'；不适用于动态表,javascript,jquery,html,Javascript,Jquery,Html,这是我的html文件： <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>

这是我的html文件：

 <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>


$（文档）.ready（函数（）
{ 
$（“#excelDataTable1”）.tablesorter（）；
} 
);

这是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();}

var myList=[{“аааааааа”：“Iphone”、“Сааааааааааааааа，
{“2”、“2”、“7”，
{“ааааааааааа”：“XBOX”，“Саааааааааааа；
函数buildHtmlTable（）{
var columns=addAllColumnHeaders（myList）；
对于（变量i=0；i


我使用jquery的tablesort对我的excelDataTable进行排序。当我使用生成的表代码并粘贴到html时，它工作得很好，但当我使用动态表时，它不工作
 根据我上面的评论，您可以尝试以下方法：
$(document).ready(function() { 
  $.when( main() ).done( function() {
    $("#excelDataTable1").tablesorter(); 
  });
}); 

有关when
方法的信息，请参见此处：
基本上，这可以确保您的main（）
函数在执行tablesorter
插件之前已经完成。
您应该在将表附加到DOM之后调用tablesorter插件。称之为onload，表可能还没有创建。哈：）谢谢）很容易，但是。。添加此代码后，有一件事我的表中有重复的行（我不是英语母语人士）不明白它的工作原理（小提琴？非常感谢Gary）我通过从正文中删除main（）来修复它）