Итерирование столбцов таблицы и построение JSON - jQuery

Question

Это может быть тривиальный вопрос, но я немного смущен, как извлечь данные столбца & построить объект.

Таблица динамична по своей природе, сгенерирована на основе предоставленных данных.

Формат как этот

<tr> 
    <td> Label </td> 
    <td> 
     <input type = "radio" value="yes"/> YES 
     <input type = "radio" value="no"/> NO 
     <textarea> 
    </td> 
    <td> 
     <input type = "radio" value="yes"/> YES 
     <input type = "radio" value="no"/> NO 
     <textarea> 
    </td> 

    // This structure can repeat 
    ... 
    ... 
</tr> 

// Rows will repeat themselves 

Я набросал этот до сих пор

$(function() { 
$('#submit').click(function() { 
    var i = 0; 
    var t = document.getElementById('table'); 
    $("#table tr").each(function() { 
     var columns = $(this).find('td'); 

     /* how to extract column data here?, so that I construct 
      a column object and keep looping for the other columns 


    }); 
}); 

Мой JSON должен быть таким: [{метка: данные, isPresent: данные, значение : data}, {..}, {..}]

Я не могу получить данные из обоих столбцов() за один раз, а затем перебираю следующие два столбца.

Answer 1

Судя по вашему вопросу, я предполагаю, что вы совсем новичок в jQuery, поэтому я дам вам простое решение, которое можно использовать во многих отношениях.

Советую добавить классы в свой HTML. Таким образом, мы можем определить все свойства строки таблицы, независимо от того, где HTML-элемент находится в тр-теге или какой тип тега данные помещаются в:

<tr> 
    <td class="item-label"> Label </td> 
    <td> 
     <input class="item-option-yes" type="radio" value="yes"/> YES 
     <input class="item-option-no" type="radio" value="no"/> NO 
    </td> 
    ... other cells with data ... 
</tr> 
... other rows ... 

В вашем each- функция, вы можете объединить $ (это) и находку() - функции для построения вашей JSON-объект

$(function() { 
$('#submit').click(function() { 
    var itemArray = []; 

    $("#table tr").each(function (index) { 
     var itemData = { 
      "label": $(this).find(".item-label").text(), 
      "isPresent": $(this).find(".item-option-yes")[0].checked, 
      "value": $(this).find(".some-other-class").text() 
     }; 
     itemArray.push(itemData); 
    }); 
}); 

для получения дополнительной информации о находке, $ (это), и каждый-функций, пожалуйста, проверьте JQuery сайт