Question

我正在使用引导程序验证器来克隆输入和单选元素。它工作正常，但是在将这些值作为JavaScript数组接收时出现问题。因为我在DOM中始终具有隐藏的输入和广播元素，所以它会发送空对象。

我如何映射数组对象以接收值

var kids = $(".form--group").map(function() {
  return {
     kidName: $(this).find('.thevoornaam').val(),
     newDob: $(this).find('.date_of_birth').val(),
    }
    }).get();
console.log(kids)

我正在接收这样的值。

[{kidName: "Test", newDob:"20"},{kidName: "", newDob:""} ]

始终接收带有空字符串的第二个对象。

如果值为空或未定义，如何从数组中删除对象。

我希望你们能理解我的问题。

谢谢。

Answer 1

您可以使用filter这样过滤掉空对象

var kids = $(".form--group").map(function() {
  return {
     kidName: $(this).find('.thevoornaam').val(),
     newDob: $(this).find('.date_of_birth').val(),
  }
}).get();

kids = kids.filter(function (kid) {
  return kid.kidName && kid.newDob;
});

console.log(kids)

Answer 2

如果每个属性为空，未定义或为0时要排除该项目；

let obj = [{kidName: "Test", newDob:"20"},{kidName: "", newDob:""} ];



let filtered = obj.filter(e=>{
    for(let p in e){
        if(e[p]){
            return true;
        }
    }
});

console.log(filtered);

Answer 3

在创建对象之前检查字符串：

$(document).ready(function(){

var kids = $(".form--group").map(function() {
      
      var kidName = $(this).find('.thevoornaam').val();
      var dob = $(this).find('.date_of_birth').val();
      var result_arr = [];

      if(kidName || dob)
      {
         var obj = {kidName: kidName, newDob: dob}
         result_arr.push(obj);
      }
      
      return result_arr;
  
    }).get();
console.log(kids)

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="form--group">
    <input class="thevoornaam" value="Test Name" />
    <input class="date_of_birth" value="Test Date" />
</div>

<div class="form--group">
    <input class="thevoornaam" value="" />
    <input class="date_of_birth" value="" />
</div>

<div class="form--group">
    <input class="thevoornaam" value="Test Name" />
    <input class="date_of_birth" value="Test Date" />
</div>

从数组javascript中删除空对象

3 个答案: