如何處理表格中只檢查過的行？

假設我有以下表格：如何處理表格中只檢查過的行？

<table> 
    <thead> 
    <tr> 
     <th>Column 1</th> 
     <th>Column 2</th> 
     <th>Column 3</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>A1</td> 
     <td><input type="checkbox"/> A2</td> 
     <td>A3</td> 
    </tr> 
    <tr> 
     <td>B1</td> 
     <td><input type="checkbox"/> B2</td> 
     <td>B3</td> 
    </tr> 
    <tr> 
     <td>C1</td> 
     <td><input type="checkbox"/> C2</td> 
     <td>C3</td> 
    </tr> 
    </tbody> 
</table>

我想只爲其複選框被選中的行生成從表JSON。我爲「插入檢查」填入了什麼？

var myRows = []; 
var $headers = $("th"); 
var $rows = $("tbody tr").each(function(index) { 
    $cells = $(this).find("td"); 
    myRows[index] = {}; 
    $cells.each(function(cellIndex) { 
    // Insert Check Here 
    myRows[index][$($headers[cellIndex]).html()] = $(this).html(); 
    });  
}); 

var myObj = {}; 
myObj.myrows = myRows; 
alert(JSON.stringify(myObj));

來源

2012-04-15 Rolando

你只有一個排在它的複選框的數組。也許你正在尋找序列化選中列？ – 2012-04-15 16:31:42

我的不好，它的一個專欄。修改後的問題來反映它。 – Rolando 2012-04-15 16:37:35

我已經添加了If語句測試，如果TD包含檢查或不復選框，看到代碼

// Loop through grabbing everything 
    var myRows = []; 
    var $headers = $("th"); 
    var $rows = $("tbody tr").each(function(index) { 
     $cells = $(this).find("td"); 
     myRows[index] = {}; 
     $cells.each(function(cellIndex) { 
     if($(this).find('checkbox').is(':checked')) //Find the checkbox within the TD and test if it's checked or not 
     { 
      myRows[index][$($headers[cellIndex]).html()] = $(this).html(); 
     } 
     });  
    }); 

// Let's put this in the object like you want and convert to JSON (Note: jQuery will also do this for you on the Ajax request) 
var myObj = {}; 
myObj.myrows = myRows; 
alert(JSON.stringify(myObj));

來源

2012-04-15 16:26:33

myRows變量顯示爲空，並在彈出的警告框中添加檢查。 – Rolando 2012-04-15 16:36:30

我看到你的評論代碼，並推測其餘的工作，因此，我只爲你添加了'if'語句。請參閱下面的一些其他答案，通常顯示解決此任務的更簡單的方法。 – 2012-04-15 16:52:48

我發佈的代碼按原樣運行，但會返回表中每行的內容（不檢查行是否有複選框）。很奇怪。 – Rolando 2012-04-15 17:06:51

與嘗試：

var selectedRowsHTML = ""; 

$('table input:checked').each(function() { 
    selectedRowsHTML += $(this).closest('tr').html(); 
}); 

console.log("This is the HTML for selected rows: "+ selectedRowsHTML);

隨着「：選中」選擇你只能說是你的表內確認輸入。遍歷它們，找到「最接近（'tr'）」的父行。就這些而言，你可以獲得每一行的HTML（或任何你想要做的事情）。

來源

2012-04-15 16:26:24

的評論怎麼樣從而

$("table input:checked") //filter based on your requirement 
.each(function() 
{ 
    var td=$(this).parent(); //gets the `td`, do the necessary 
});

來源

2012-04-15 16:27:39 Baz1nga

你可以使用複選框：檢查選擇器和最接近的查找特定類型的最近元素。

var selectedRows = []; 
$('table input:checkbox:checked').each(function() { 
    selectedRows.push($(this).closest('tr')) 
});

selectedRows包含選定錶行

來源

2012-04-15 16:50:37

如何處理表格中只檢查過的行？

回答

相關問題