сборки Javascript массив объектов не удалось

Question

Я хочу, чтобы произвести этот

arr = [{ 
    "name": "john", 
    "tel": 123 
}, { 
    "name": "marry", 
    "tel": 999 
}]; 

, но что я получил с ниже код только один массив.

var arr = [{}]; 

$('button').click(function() { 
    $.each($('.row'), function() { 
     arr.name = $(this).find('li.name input').val(); 
     arr.tell = $(this).find('li.tel input').val(); 
    }); 

    console.log(arr); 
}); 

Что в этом плохого? http://jsfiddle.net/1LLwh15f/1/

Answer 1

Все, что вы делаете в своем коде, снова и снова назначает одни и те же свойства свойства экземпляра массива. Вы ничего не делаете для создания объектов, которые вы сказали в своем массиве, или для добавления каких-либо записей в массив.

Чтобы добавить вещи в массив, вы можете использовать Array#push. Для создания объектов вы можете использовать object initializer.

$.each($('.row'), function() { 
    arr.push({ 
     name: $(this).find('li.name input').val(), 
     tell: $(this).find('li.tel input').val() 
    }); 
}); 

В качестве альтернативы, вы можете использовать функцию map JQuery в:

arr = $('.row').map(function() { 
    return { 
     name: $(this).find('li.name input').val(), 
     tell: $(this).find('li.tel input').val() 
    }; 
}).get(); // <== Note the .get() at the end 

---

Side Примечание: Ваш инициализацию:

var arr = [{}]; 

... создает массив с одним пустым объектом в Это. Вам не нужен пустой объект, только = [] - это все, что вам нужно для создания массива.

Answer 2

Вы не толкая OBJ только вы снова и снова переопределение, если вы хотите выход желание сделать это

var arr = []; 

$('button').click(function(){ 
    $.each($('.row'), function(){ 
     var obj={}; 
    obj.name = $(this).find('li.name input').val(); 
    obj.tell = $(this).find('li.tel input').val(); 
     arr.push(obj) 
}); 

console.log(arr); 
}); 

DEMO

Answer 3

Вы должны push в массив. Это добавит новый объект в массив в конце.

var arr = []; 
// Remove {} from array declaration 

$('button').click(function() { 
    $('.row').each(function() { 
     // push object inside array 
     arr.push({ 
      name: $(this).find('li.name input').val(), 
      tell: $(this).find('li.tel input').val() 
     }); 
    }); 

    console.log(arr); 
}); 

Демо: http://jsfiddle.net/tusharj/1LLwh15f/2/

Answer 4

Вы хотите добавить данные в массив неправильно.

Попробуйте вместо этого:

var arr = []; // Don't add the empty object there. 
 

 
$('button').click(function() { 
 
    $.each($('.row'), function() { 
 
     arr.push({ 
 
      name: $(this).find('li.name input').val(), 
 
      tell: $(this).find('li.tel input').val() 
 
     }); // Add a new element to the array, containing the current row's data. 
 
    }); 
 

 
    console.log(arr); 
 
    alert(JSON.stringify(arr)); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
    <li class="name"><input value="" placeholder="name" /></li> 
 
    <li class="tel"><input value="" placeholder="tel" /></li> 
 
</div> 
 
<br> 
 
<div class="row"> 
 
    <li class="name"><input value="" placeholder="name" /></li> 
 
    <li class="tel"><input value="" placeholder="tel" /></li> 
 
</div> 
 
<br> 
 
<button>submit</button>

Array.prototype.push На самом деле добавляет новый элемент в конец массива, вместо того, что вы делали, что добавлял name и tell свойства в объект массива.

Answer 5

Вы должны передать значения в массив не использовать его в качестве объекта

var temp = { 
    name: $(this).find('li.name input').val(), 
    temp: $(this).find('li.tel input').val() 
} 

arr.push(temp); 

http://jsfiddle.net/yvzukj47/