Question

尝试在jquery mobile中添加我的列表，但我不能让分隔符位于添加到列表视图中的最新项目之上。

我已尝试在添加项目之前添加，但然后将分隔符切换到底部。

function loadScanItems(tx, rs) {
    var rowOutput = "";
    var $scanItems = $('#scanItems');
    $scanItems.empty();
    var bubbleCount = 0;
    for (var i = 0; i < rs.rows.length; i++) {
        bubbleCount = bubbleCount + 1;
        //rowOutput += renderScan(rs.rows.item(i));
        var row = rs.rows.item(i)
        var now = row.added_on;
        var date = get_date(now);
        rowOutput += '<li data-icon="false"><a href="javascript:void(0);" onclick="webdb.deleteScan(' + row.ID + ');"><div class="ui-grid-b"><div class="ui-block-a" style="width:50%"><h3>Su # ' + row.sunum + '</h3><p> Bin # ' + row.binnum + '</p></div><p class="ui-li-aside"><strong>' + date + '</strong></p><div class="ui-block-b" style="width:20%"></div><div class="ui-block-c" style="width:25%"><br><p>User: ' + row.userid + '</p></div></div></a></li>';
        // rowOutput += '<li><a href="#">' + row.sunum + row.binnum+ "<a href='javascript:void(0);'  onclick='webdb.deleteScan(" + row.ID + ");'>Delete</a></a></li>";
    }
    $scanItems.append('<li data-role="list-divider">Scanned Items <span class="ui-li-count">' + bubbleCount + '</span></li>').listview('refresh');
    $scanItems.append(rowOutput).listview('refresh');
}

上面的代码是正确格式化的，顶部有分隔符，但是列表项被追加到底部，而不是添加到顶部。

谢谢！

Answer 1

问题是您正在构建包含所有扫描项目的字符串。该字符串已经有一个订单，所以无论你是prepend还是append都没有区别。试试这个简单的改变。

变化：

rowOutput += '<li data-icon="false">...</li>';

为：

rowOutput = '<li data-icon="false">...</li>' + rowOutput;

这将在追加到列表视图之前将rowOutput字符串按正确顺序放置。

这是一个有效的 DEMO

JQuery移动列表前置

1 个答案: