Question

这可能是一项简单的任务，但我仍然坚持这样做。

我有一个包含以下结构的列表：

<ul id='index_orders'>
 <li data-role='list-divider'>Awaiting picking</li>
 <li>Blah blah</li>
 <li data-role='list-divider' id='index_orders_ad_divider'>Awaiting delivery</li>
 <li>Blah blah</li>
</ul>

我正在启动ajax调用以获取<li id='index_orders_ad_divider'>条目下的等待订单列表。

到目前为止，我已经做到了这一点，但似乎无法弄清楚如何首先删除<li>之后出现的所有<li>，其ID为“index_orders_ad_divider”，然后再添加新的：

    $.getJSON(root_url + $(this).attr('href') + '?callback=?', null, function (d) {
        $("#index_orders_ad_divider").after(d.html);
        $("#index_orders").listview('refresh');
        $("#index_pickedOrders_count").html($("#index_pickedOrders > li").length);
        $.mobile.loading('hide');
    });

Answer 1

这是实现此目的的一种方法，不幸的是，它需要两个步骤：

$.getJSON(root_url + $(this).attr('href') + '?callback=?', null, function (d) {
    // Cache $el since we're using it a couple times.
    var $el = $("#index_orders_ad_divider");

    // Remove all <li>s after this one
    $("#index_orders li:gt(" + $el.index() + ")").remove();

    // Insert the new <li>s after this one.
    $el.after(d.html);

    $("#index_orders").listview('refresh');
    $("#index_pickedOrders_count").html($("#index_pickedOrders > li").length);
    $.mobile.loading('hide');
});

示例： http://jsfiddle.net/6zAN7/3/

Jquery在列表中的选择器后替换元素

1 个答案: