如何使用每个并将数据推送到 jquery 中的数组

Question

如何向数组添加数据？我有一些选项的表单输入，我使用按钮添加更多来添加部分表单输入。我想让已选择的选项不显示在索引的其余部分中。示例：

index 0 我选择了G05B-IA1
index 1 我选择了G05B-IA2
index 2 我选择了G05B-IA3

然后我将它存储在一个数组中。我想要这样的结果 [G05B-IA1,G05B-IA2,G05B-IA3] 但是，我得到的结果是 ['G05B-IA2', 'G05B-IA2', 'G05B-IA2']

我的Jquery代码

  $(document).on('change', '.slot_id', function(){
      cekslotid = $(this).val(); 
      console.log(cekslotid);
  });

  $(document).on('change', '.warehouse2', function(){
      var warehouseid = $(this).val(); 
      let idtarget  = $(this).data('idtarget');
      let cektarget = idtarget - 1;
      let slotid1   = $("#slot_id").val();
      let slotid2   = $("#slot_id"+cektarget+'').val();
      let data      = [slotid1];

  
  $('.slot_id').each(function() {
    data.push($(cekslotid).val());
  });

  console.log(data);

我的 HTML 在视图中

<div class="add-more-pallet">
                <div class="row">
                    <div class="col-md-6">
                        <label>Pilih Gudang : </label>
                        <div class="input-group mb-3">
                            <div class="input-group-prepend">
                                <span class="input-group-text"><i class="fas fa-warehouse"></i></span>
                            </div>
                            <select class="form-control" id="warehouse" required>
                                <option value="">-- Pilih Gudang --</option>
                                @foreach($warehouse as $row)
                                <option value="{{ $row->id_warehouse }}">{{ $row->warehouse_name }}</option>
                                @endforeach
                           </select>
                        </div>
                    </div>
                  <div class="col-md-5">
                        <label>Pilih Pallet : </label>
                        <div class="input-group mb-3">
                            <div class="input-group-prepend">
                                <span class="input-group-text"><i class="fas fa-pallet"></i></span>
                            </div>
                            <select class="form-control slot_id" id="slot_id" name="slot_id[]" required><option value="">-- Pilih Pallet --</option></select>
                        </div>
                    </div>

我的 HTML 在 Jquery

'<div class="col-md-6">' + 
                        '<label>Pilih Gudang : </label>' +
                        '<div class="input-group mb-3">' +
                          '<div class="input-group-prepend">' +
                            '<span class="input-group-text"><i class="fas fa-warehouse"></i></span>' +
                          '</div>' +
                          '<select class="form-control warehouse2" data-idtarget="'+i+'" required>' +
                            '<option value="">-- Pilih Gudang --</option>' +
                            '<option value="G05B">Gudang 05 B</option>' +
                            '<option value="G09">Gudang 09</option>' +
                          '</select>' +
                        '</div>' +
                      '</div>' +
                      '<div class="col-md-5">' + 
                        '<label>Pilih Pallet : </label>' +
                        '<div class="input-group mb-3">' +
                          '<div class="input-group-prepend">' +
                            '<span class="input-group-text"><i class="fas fa-pallet"></i></span>' +
                          '</div>' +
                          '<select id="slot_id'+i+'" class="form-control slot_id" name="slot_id['+i+']" data-idtarget="'+i+'" required><option value="">-- Pilih Pallet --</option></select>' +
                        '</div>' +
                      '</div>' +

我的代码有什么问题？为什么存储在数组中的值会变成double？

Answer 1

您一遍又一遍地推送相同的值，即您在此处设置的值

$(document).on('change', '.slot_id', function(){
  cekslotid = $(this).val(); 
});

这是一个工作方法

let data = $('.slot_id').map(function() { return this.value }).get();

如何使用每个并将数据推送到 jquery 中的数组

How to used each and push data to array in jquery

jquery

ajax

push

add