在javascript中从数组中删除单击的项

removing clicked item from array in javascript

本文关键字：单击 删除 数组 javascript      更新时间：2023-09-26

我有一个点击功能来列出所选项目。此外，我将所选项目推送到一个数组中。这部分没有问题，这里是函数。

$('#addToCartButton2').click(function(){  
    var toAdd=$("#chooseItem2 option:selected").text();
    var itemNbr2=$("#itemNbr2").val();
    if(toAdd !== defaultSelectFormText && itemNbr2 >=1){
        $('#defaultText').remove();
        $('.col-md-5').append('<p id="items">' + itemNbr2 + ' Adet ' + toAdd + '<span class="extra">Sipariş listesinden çıkarmak için tıklayın!</span>' + '</p>');
        ordersArray.push(itemNbr2 + ' Adet ' + toAdd);
        alert(ordersArray.toString());
    };
});

但我也有一个功能可以从列表中删除点击的项目。所以我想在单击该项时也将其从数组中删除。我尝试使用拼接方法，但无法获得单击项目的索引。这是remove函数。

$(document).on('click', '#items', function() {

    $(this).remove();
    var index = ordersArray.indexOf($(this).val());
    alert(index);
    if (index > -1) {
        ordersArray.splice(index, 1);
    }
});

如何获取列表中单击项目的索引？

首先，要么使项的id唯一，要么像我在这个解决方案中所做的那样使用class而不是id。

$('#addToCartButton2').click(function(){  
    var toAdd=$("#chooseItem2 option:selected").text();
    var itemNbr2=$("#itemNbr2").val();
    if(toAdd !== defaultSelectFormText && itemNbr2 >=1){
        $('#defaultText').remove();
        $('.col-md-5').append('<p class="items"><span>' + itemNbr2 + ' Adet ' + toAdd + '</span><span class="extra">Sipariş listesinden çıkarmak için tıklayın!</span>' + '</p>');
        ordersArray.push(itemNbr2 + ' Adet ' + toAdd);
        alert(ordersArray.toString());
    };
});
$(document).on('click', '.items', function() {
    var index = ordersArray.indexOf($('span:first', this).text());
    alert(index);
    if (index > -1) {
        ordersArray.splice(index, 1);
    }
    $(this).remove();
});

在从列表中删除单击的项目的功能中，进行以下更改：

$(document).on('click', '#items', function() {
    var index = ordersArray.indexOf($(this).text());
    alert(index);
    if (index > -1) {
        ordersArray.splice(index, 1);
    }
    $(this).remove();
});

删除项目的方式似乎有点复杂。为什么不为添加的每个项目使用一个uniqe ID，然后删除呢物品的ID？

相关文章：