Question

我有一个按名称按字母顺序排序的表（使用PHP mysql），现在我想在表中的正确位置插入一个新行而不向服务器发出新请求。有没有办法通过表检查每个名称并使用jQuery / Javascript将新行插入正确的位置？

Answer 1

有很多方法，这只是其中一个使用jquery：

让我们设置你的新名字和新行el

var newName = 'YourNewName'
var newRow = $('<tr>') // created new row element with cells

获取名称列表，添加newName并对其进行排序;假设你的名字栏是2

var names = $('td:nth-child(2)').map(function () {return $(this).text()})
names.push(newName)
var sorted = names.sort()

获取添加名称的位置

var newNamePos = sorted.indexOf(newName)

将新行插入找到的位置

$('tr:nth-child(' + (newNamePos + 1) + ')').before(newRow)

Answer 2

您也可以在最后（或任何地方）插入它，然后使用js / jquery重新排序整个表：

var table  = $('table'),
    rows   = $('tr', table);

$('#sortIt').click(function () {
    rows.sort(function(a, b) {
        var keyA = $('td',a).text();
        var keyB = $('td',b).text();
        return (keyA > keyB) ? 1 : 0;
    }); 
    rows.each(function(index, row) {
        table.append(row);
    });
});

示例here at jsFiddle。

在表格中按字母顺序插入表格行

2 个答案: