0

我有一个 XML 文件（由几个数据项组成，即<Book>）和我创建的相应 XSLT 文件，当在浏览器中打开该文件时，该文件会将此书籍列表转换为 html 表。这些列被命名为“Author”、“Title”和“BookID”（它们是id的子节点<tr>）。

现在我想使用 jQuery 使生成的页面动态化，即我想让生成的表行在我单击的列上进行排序。然而，虽然表格渲染得很好，但生成的 jQuery 代码似乎没有效果。

我不确定这是否是由于我的 jQuery 代码中的错误，或者我没有正确包含它，或者两者兼而有之。我在我的 XSL 文件中包含了两个<script></script>标签（一个用于热链接 jQuery 库，另一个用于链接到我的代码），但我不确定这是否是正确的方法。另外，有人可以查看我的 jQuery 代码以找出是否有任何问题（我是网络编程的新手，所以请原谅我的错误）？

谢谢！

$(document).ready(function() {

function sortBy(a, b, selectFunction) {
    var a1 = selectFunction(a);
    var b1 = selectFunction(b);

    if (a1 < b1) {
        return -1;
    }
    if (a1 > b1) {
        return 1;
    }
    return 0;
}

function sortHelper(index) {
    var rows = $('table tbody tr').get();
    rows.sort(function(a, b) {
        return sortBy(a, b, function(x) { return $(x).children('td').eq(index).text().toUpperCase(); });
    });
    rows.appendTo('tbody');
}

$('#Author').click(function() {
   sortHelper(0);
});

$('#Title').click(function() {
    sortHelper(1);
});

$('#BookID').click(function() {
    sortHelper(2);
});

});
4

1 回答 1

2

注释中的 A.get()返回一个 javascript 对象。所以要使用rows.sort()你想要的 jQuery 对象。

// javascript
$(obj).get(0); // returns the first element from the query
// jquery
$(obj).eq(0); // return the first $(element) from the query.

我还注意到一件事：由于您通过 an 访问 td，id您可以执行以下操作：

var topRow = $("table tbody tr").eq(0),
    topCells = topRow.find("td"); // expecting #author, #title, #bookid

topCells.click(function(){
    sortHelper($(this).index()); // makes more sense this way
});

除此之外，如果您将外部 *.js 文件加载到您的解决方案中，您会没事的。如果您将代码直接插入页面，请使用此处所述的 CDATA 编码。

于 2013-05-02T18:41:24.310 回答