1

我有一个静态 HTML 页面，它使用 Ajax 加载动态表。我要加载的表是使用 list.js 和 jQuery 构建的可排序表。当表格按行编码时，它们会加载并且可以毫无问题地进行排序。我一介绍 Ajax，数据就会出现，但排序不再起作用。

我知道绑定和 .on() 但我不确定如何使用 list.js

示例代码：

<html>
<head>
<script 
src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"
src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"
src="//listjs.com/js/list.js"

$(document).ready(function(){

// Define value names
var overview_options = { valueNames: [ 'name', 'term', 'module', 'activity' ] };

// Init list
var overviewList = new List('list_overview', overview_options);

});

function loadTable() {

getTable=new XMLHttpRequest();
getTable.onreadystatechange=function()
{
if (getTable.readyState==4 && getTable.status==200)
    {
            document.getElementById("tableArea").innerHTML=getTable.responseText;
    }
}
getTable.open("GET","tableDate.html",true);
getTable.send();        
}

</script>

</head>
<body>

<div onClick="loadTable();">Load Table</div>
<div id="tableArea"></div>

</body>
</html>

Ajax 正在引入文件：

<div class="list_holder">
  <table id="list_overview" cellpadding="10" >
    <thead>
      <tr>
        <th><span class="sort" data-sort="name">Name</span></th>
        <th><span class="sort" data-sort="term">Term</span></th>
        <th><span class="sort" data-sort="module">Module</span></th>
        <th><span class="sort" data-sort="activity">Activity</span></th>
      </tr>
    </thead>
    <tbody class="list">
      <tr>
        <td class="name">Zack Walker</td>
        <td class="term">3</td>
        <td class="module">Body Language</td>
        <td class="activity">None</td>
      </tr>
      <tr>
        <td class="name">Peter Jones</td>
        <td class="term">1</td>
        <td class="module">Body Language</td>
        <td class="activity">All</td>
      </tr>
      <tr>
        <td class="name">Zack Walker</td>
        <td class="term">3</td>
        <td class="module">Helping</td>
        <td class="activity">All</td>
      </tr>
    </tbody>
  </table>
  </td>
  </tr>
  </tbody>
  </table>
</div>

非常感谢！

4

1 回答 1

5

只是在这里猜测，您在 ajax 响应中填充数据后不应该初始化列表吗？

于 2013-09-10T21:28:08.387 回答