從數組添加和刪除項目到listview

Question

我希望從數組添加和刪除項目到listview，它與購物車類似，但我使用listview來做到這一點。

我試圖使用append（），但它會雙重添加項目，刪除功能不起作用

$('#deleteme').on('tap', function () {

    console.log('delete button is tapped')
    $(this).parent().remove();
    $('#cartlist').listview('refresh');});

  $("#Addtocart").click(function () {
    console.log("addtocart button is tapped");

    var add = "";
    var title = arr[gindex].title;
    var price = arr[gindex].price;

    var Oprice = arr[gindex].Oprice;
    var img = arr[gindex].imgSmall;
    var Expiry = arr[gindex].Expiry;

    add = add + "<li><a class='ui-icon-delete' id='deteleme'>
     <img src=img/"
     + img + "><h3>" + title + "</h3><p><b>" + price + '</b><br>'
     + '<strike>' + Oprice + '</strike>' + '<br>' + "Expiry: " + Expiry 
     + "</p></a></li>";

    $('#cartlist').append(add);
    console.log("item is added");

    $('#cartlist').listview('refresh');
    console.log(add);});

我希望逐個添加項目，我可以刪除我想要的任何項目

Answer 1

您可以動態添加具有id deleteme li，附加單擊處理程序但該項目不存在。 所以，你需要使用委托

$('body').on('tap','#deleteme', function () {
...
})

最好使用最接近的deleteme父級而不是$('body')來獲得更好的性能