html 检查数组中是否存在元素不起作用

vi4fp9gy  于 2023-03-27  发布在  其他
关注(0)|答案(1)|浏览(148)

不好意思打扰你了,我已经琢磨了两个小时了,问题是我的代码只添加了一个元素,而没有添加其他的id,写的是“already have”

$(function(){

    $(".js-compare-add").click(function(){
        var item_id = $(this).data('id');

        if(Cookies.get('compare_id_list')){
            var compareListStr = Cookies.get('compare_id_list');
            var compareListArr = compareListStr ? compareListStr.split(',') : [];
            if (compareListArr.indexOf(item_id) > -1) {
                compareListArr.push(item_id);
                Cookies.set('compare_id_list', compareListArr.join(','), {expires: 10}); 
                alert('Save! ' + item_id);
            } else {
                alert('already have ' + item_id);
            }

        } else {
            alert('There was no list, we created it and added this position ' + item_id);
            Cookies.set('compare_id_list', item_id);
        }

    });
});

以防万一-我用它来做cookie https://github.com/js-cookie/js-cookie if(jQuery.inArray(item_id,compareListArr)=== -1)也没用

vm0i2vca

vm0i2vca1#

Dave Newton提出了一个有用的观点,即逻辑似乎是向后的,但如果这是你试图让它工作的结果:
当你使用data函数时,jQuery会进行数据操作,它不会只给予你匹配的data-id属性的字符串值。如果属性的文本都是数字,jQuery会将其转换为数字:

const id = $("#example").data("id");
console.log(typeof id); // number
<div id="example" data-id="123"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

所以indexOf不会在字符串数组中找到它,因为它会进行===比较。
如果ID应该是一个字符串,并且您没有使用data的特殊原因,请使用attr

const item_id = $(this).attr("data-id");

根据我的经验,绝大多数时候人们使用data("x"),他们真正想要的是attr("data-x")data只是data-*属性的访问器,它比data-*属性更多,也更少。
或者,如果您希望ID是一个数字,请使用另一种方式:将数组中的元素转换为分割后的数字:

const compareListArr = compareListStr
    ? compareListStr.split(",").map((id) => +id)
    : [];

(The一元+只是解析数字的一个选项,请参阅此处的其他选项。
旁注:在新代码中,我更喜欢includes而不是indexOf。下面是更正了逻辑并使用includesif(注意,我已经切换了ifelse块):

if (compareListArr.includes(item_id)) {
    // Exists, don't push it
} else {
    // Doesn't exist, push it
}

相关问题