JQuery - создание массива объектов, содержащих ключ - пары значений

Question

У меня есть следующий HTML-код:

<div class="input_data"> 
    <input type="text" name = 'firstname' class="fname"> 
    <input type="text" name = 'lastname' class="lname"> 
</div> 
<br> 
<br> 
<div class="input_data"> 
    <input type="text" name = 'firstname'class="fname"> 
    <input type="text" name = 'lastname' class="lname"> 
</div> 
<button id="sbmt">Submit</button> 

Я пытаюсь назначить пары строк из входов в качестве объекта в массиве JQuery через следующие код:

$('#sbmt').on('click', function() { 

    var this_row = {}; 
    //var all_rows = []; 

    $('.input_data').each(function(){ 

     $('> input', this).each(function(){ 

      //this_row[$(this).attr('name')] = $(this).val(); 
      //this_row.push($(this).attr('name')) = $(this).val(); 
      keyvalue = $(this).attr('name'); 
      namevalue = $(this).val(); 
      alert(keyvalue + " is : " + namevalue); 
      this_row[keyvalue] = namevalue; 
      //all_rows.push({$(this).attr('name'):$(this).val()}); 
     }); 

    }); 

Как вы можете видеть, что я сохранил заявление с ALL_ROWS комментировал - на самом деле он дает ошибку, что использование «это» не является законным здесь.

Выполнение этого кода в его текущей форме хранит только значения из второго набора входов.

я на самом деле нужно создать массив объектов, как

[{firstname:firstname-1, lastname:lastname-1}, {firstname:firstname-2, lastname:lastname:2}] 

Как я могу сделать это произошло? Также я хотел бы знать, как сделать заявление all_rows.push({$(this).attr('name'):$(this).val()}); работы.

Answer 1

Вам нужно что-то вроде этого:

$('#sbmt').on('click', function() { 

    var all_rows = []; 

    $('.input_data').each(function() { 
      var this_row={}; 
      $(this).find("input").each(function(){ 

      keyvalue = $(this).attr('name'); 
      namevalue = $(this).val(); 
      this_row[keyvalue] = namevalue; 
     }); 
     all_rows.push(this_row); 

    }); 
    console.log(all_rows); 
    }); 

https://jsfiddle.net/9kxxwz0n/