拼接删除JavaScript中的随机元素问题

Splice removing random elements issue in javascript

本文关键字:随机 元素 问题 删除 JavaScript 拼接      更新时间:2023-09-26

我正在尝试使用 jQuery 创建交互式购物车,但拼接问题毁了一切,因为当我直接删除元素时,它对我来说非常完美,但比我要动态更改它不起作用即使在更新索引后删除数组中的随机元素。

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<div id="myDIV2"></div>
<div id="myDIV"></div>
<script>
 var wishlistArray = ["Item1", "Item2", "Item3", "Item4", "Item5"];
 function wishlist_show() {
     var wishlistArrayDom = "";
     jQuery.each(wishlistArray, function (i, wishlistID) { 
         wishlistArrayDom += '<div><a href="javascript:;" class="rem-from-wishlist" value="' + i + '">Remove( ' + wishlistID + ' )</a></div>';
     });
     $('#myDIV').empty();
     $('#myDIV').html(wishlistArrayDom);
     wishlist_update_rem();
     console.log('All: ' + wishlistArray.length);
     console.log('Arr: ' + wishlistArray);
 }
 function wishlist_rem(num) {
     console.log('Value: ' + $(this).attr('value'));
     console.log('All: ' + wishlistArray.length);
     console.log('Arr: ' + wishlistArray);
     $(this).parent().slideUp("slow", function () {
         console.log(wishlistArray.splice($(this).attr('value'), 1));
         wishlist_show();
     });
     $('#myDIV2').append('<br>Remove ' + wishlistArray[parseInt($(this).attr('value'))] + ' of element' + +$(this).attr('value'));
 }
 wishlist_show();
 function wishlist_update_rem() {
     $(".rem-from-wishlist").unbind("click");
     $(".rem-from-wishlist").click(wishlist_rem);
 }
</script>

Jsfiddle 示例

更新:我自己解决,谢谢大家,堆栈溢出是最好的。

准备使用的 jsfiddle http://jsfiddle.net/ar0zrxwc/

这不是

splice()的问题,而是您对this范围的问题。

将您的删除功能更改为:

function wishlist_rem(num) {
     var idx = parseInt($(this).attr('value')));
     $(this).parent().slideUp("slow", function () {
         wishlistArray.splice(idx, 1));
         wishlist_show();
     });
     $('#myDIV2').append('<br>Remove ' + wishlistArray[parseInt($(this).attr('value'))] + ' of element' + +$(this).attr('value'));
 }

您的问题是动画回调中的this是单击的元素的父级,该元素没有值属性。只需在当前记录索引值的同一点定义一个变量即可。

 function wishlist_rem(num) {
     var index = parseInt( $(this).attr('value'),10);
     $(this).parent().slideUp("slow", function () {
         console.log(wishlistArray.splice(index, 1));
         wishlist_show();
     });
     $('#myDIV2').append('<br>Remove ' + wishlistArray[parseInt($(this).attr('value'))] + ' of element' + +$(this).attr('value'));
 }

演示