Как я могу удалить указанное c значение из jquery массива в jquery

Question

Я хотел бы удалить указанное значение c из массива, я пробовал следующий скрипт для удаления значения из массива, но это не работает.

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>