在JQuery中创建动态html表后，应用另一个JQuery (表排序程序)
在JQuery中创建动态html表后，应用另一个JQuery (表排序程序)
提问于 2011-11-09 21:15:08
我已经用JQuery从PHP的JSON数据创建了超文本标记语言表格。创建表后，我尝试附加表排序(JQuery)，但它不起作用。如何解决？代码如下：
<script type="text/javascript">
$(document).ready(function() {
$.getJSON('listnotice.php', function(data) {
var table = "";
$.each(data, function(index,entry) {
table += '<tr>';
table += '<td>' +entry["title"] + '</td>';
table += '<td>' +entry["content"] + '</td>';
table += '<td>' +entry["date"] + '</td>';
table += '</tr>';
});
table += "</tbody>";
$("#noticeList").append(table);
});
$("#noticeList").tablesorter({debug: false, widgets: ['zebra'], sortList: [[0,0]]}).tablesorterFilter({filterContainer: $("#filter-box"),
filterClearContainer: $("#filter-clear-button"),
filterColumns: [0],
filterCaseSensitive: false});
});
</script>
</head>
<body>
<table id="noticeList">
<thead><tr><th>1</th><th>2</th><th>3</th></tr></thead><tbody>
</tablev>
</body>
</html>回答 2
Stack Overflow用户
回答已采纳
发布于 2011-11-09 21:19:09
您需要在构建表的同一回调中应用表排序。getJSON调用是异步的，现在的方法是在调用返回并构建表之前应用tablesorter。
$.getJSON('listnotice.php', function(data) {
var table = "";
$.each(data, function(index,entry) {
table += '<tr>';
table += '<td>' +entry["title"] + '</td>';
table += '<td>' +entry["content"] + '</td>';
table += '<td>' +entry["date"] + '</td>';
table += '</tr>';
});
table += "</tbody>";
$("#noticeList").append(table)
.tablesorter({debug: false, widgets: ['zebra'], sortList [[0,0]]}).tablesorterFilter({filterContainer: $("#filter-box"),
filterClearContainer: $("#filter-clear-button"),
filterColumns: [0],
filterCaseSensitive: false});
}); Stack Overflow用户
发布于 2011-11-09 21:20:00
当.tablesorter()插件被调用时，ajax请求仍然在执行。如果您在成功处理程序中移动表排序器，它应该可以工作。
试试这个：
$(document).ready(function() {
$.getJSON('listnotice.php',
function(data) {
var table = "";
$.each(data, function(index,entry) {
table += '<tr>';
table += '<td>' +entry["title"] + '</td>';
table += '<td>' +entry["content"] + '</td>';
table += '<td>' +entry["date"] + '</td>';
table += '</tr>';
});
table += "</tbody>";
$("#noticeList").append(table).tablesorter({debug: false, widgets: ['zebra'], sortList: [[0,0]]}).tablesorterFilter({filterContainer: $("#filter-box"),
filterClearContainer: $("#filter-clear-button"),
filterColumns: [0],
filterCaseSensitive: false});
}
);
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8065546
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号