我如何从 jquery 中的 jquery 数组中删除特定值

Question

我想从数组中删除特定值，我尝试按照以下脚本从数组中删除值，但没有用。

包含数组值的 HTML

<input type="hidden" class="image_array" id="image_array" name="image_array[]" value="20200207050212.jpg,20200207050214.jpg">

所以我的数组值是20200207050212.jpg,20200207050214.jpg & 我想从这个数组中删除20200207050212.jpg但当我使用以下脚本时不删除。

1路

$(document).ready(function(){
  $(document).on("click", '.profile_delete_image', function(){
        var getImageName = $(this).attr('data-imagename');
        console.log(getImageName)
        var getImageArray =$('.image_array').val();
        var checkValueExist = (getImageArray.indexOf(getImageName) > -1);
        if(checkValueExist == true){
          var itemtoRemove = getImageName;
          getImageArray = $.grep(getImageArray, function(value) {
            return value != itemtoRemove;      
              console.log(getImageArray)
          });
        }
    });
})

2路

$(document).ready(function(){
  $(document).on("click", '.profile_delete_image', function(){
        var getImageName = $(this).attr('data-imagename');
        console.log(getImageName)
        var getImageArray =$('.image_array').val();
        var checkValueExist = (getImageArray.indexOf(getImageName) > -1);
        if(checkValueExist == true){
          var itemtoRemove = getImageName;
          getImageArray.splice(1,1);
        }
    });
})

注意：当我执行 console.log 时，它会返回分隔值，例如

2
0
2
0
0
2
0
7
0
5
0
2
1
2
j
p
g

所以我不想要这个，我只想从数组中删除给定的值并返回一个删除了值的数组。

Answer 1

只需使用split()将字符串作为数组。

 var getImageName = '20200207050212.jpg' // Get your delete image name. var getImageArray = []; getImageArray = $('.image_array').val().split(','); getImageArray = getImageArray.filter(e => e !== getImageName); console.log(getImageArray);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="hidden" class="image_array" id="image_array" name="image_array[]" value="20200207050212.jpg,20200207050214.jpg">

Answer 2

看一下代码片段，这是一个简单的例子，这里我们有一个images数组，当单击按钮时，它将从image_array获取要删除的图像。

检查 images_array 是否具有值，并使用.split()将其转换为数组。 然后遍历数组并删除图像数组中的值是否匹配。

 var $ = jQuery; var images = ['20200207050212.jpg', '20200207050214.jpg', 'abc.jpg', 'image_123123.jpg']; $('#delete_image').on('click', function() { console.log('before delete', images); var image_arr = $('#image_array').val(); image_arr = image_arr ? image_arr.split(',') : image_arr; if (image_arr.length) { image_arr.forEach(function(img) { if (images.indexOf(img) !== -1) images.splice(images.indexOf(img), 1) }) console.log('after delete', images); } })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script> <input type="hidden" class="image_array" id="image_array" name="image_array[]" value="20200207050212.jpg,20200207050214.jpg"> <button id="delete_image">Delete Image </button>