jQuery複選框和

我有一個表已經填充了結果。我也有一個我想用來操縱表格內容的複選框。jQuery複選框和

複選框：

分公司

一個
乙
Ç

我的表看起來像這樣

名稱|年齡|科
亞當，12，A
地理，20，B

我希望能夠刪除並基於該表中添加一行檢查什麼。我是新來的jQuery，到目前爲止，我擁有的是：任何幫助？

function sortByBranch() { 
j$('#sfiltersb li label input[type="checkbox"]').bind("change", function(){ 
     if(j$(this).hasAttr("checked"){ 
      //do something 
     } 
     }); 

}

HTML

<ul id="haystack" class="slist"> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-aa" value="AA" checked="checked" class="scritb" />Branch AA</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ab" value="AB" checked="checked" class="scritb" />Branch AB</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ac" value="AC" checked="checked" class="scritb" />Branch AC</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ba" value="BA" checked="checked" class="scritb" />Branch BA</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-bb" value="BB" checked="checked" class="scritb" />Branch BB</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-bc" value="BC" checked="checked" class="scritb" />Branch BC</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ca" value="CA" checked="checked" class="scritb" />Branch CA</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-cb" value="CB" checked="checked" class="scritb" />Branch CB</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-cc" value="CC" checked="checked" class="scritb" />Branch CC</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-da" value="DA" checked="checked" class="scritb" />Branch DA</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-db" value="DB" checked="checked" class="scritb" />Branch DB</label></li> 
         <li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-dc" value="DC" checked="checked" class="scritb" />Branch DC</label></li> 
        </ul> 
       <button type="submit" class="btn" id="branch-search-btn" style="width:100%; font-size:13px; min-height:30px;">Search</button>

來源

2013-07-09 Thomas Riddler

請也表明，部分的HTML和你想要的複選框做什麼。 –

您可以在使用this.checked如果還是看語句是否複選框被選中並不：

j$('#sfiltersb li label input[type="checkbox"]').change(function(){ 
    if (this.checked) { 
     //add row (sample row) 
     $(this).closest("tr").after("<tr><td>New row</td></tr>"); 
    } 
});

來源

2013-07-09 16:54:56 tymeJV

HTML

<input type="checkbox" value="A" /> 
<input type="checkbox" value="B" /> 
<input type="checkbox" value="C" /> 
<table> 
<thead><tr><th>Name</th><th>Age</th><th>Branch</th></tr></thead> 
<tbody> 
    <tr><td>Adam</td><td>12</td><td>A</td></tr> 
    <tr><td>Geo</td><td>20</td><td>B</td></tr> 
    <tr><td>Peter</td><td>42</td><td>C</td></tr> 
</tbody> 
</table>

的JavaScript

$(function() { 
     $('input:checkbox').change(function() { 
     if ($(this).is(':checked') === true) { 
      var myAlpha = $(this).val(); 
      $('table tbody tr:last').after('<tr><td></td><td></td><td>' + myAlpha + </td></tr>'); // add a row with the value of the checkbox in the last col 
     } else { 
      $('table tbody tr td:contains(myAlpha)').closest('tr').remove(); // remove the row that has the value of the checkbox in the last col 
     } 
    }); 
});

來源

2013-07-09 17:01:39 DevlshOne

基於此HTML：

<table id="table"> 
    <tr id="1"><td>a</td><td>b</td><td>c</td></tr> 
    <tr id="2"><td>D</td><td>E</td><td>F</td></tr> 
</table> 

<input type="checkbox" class="check" value="item1" /> 
<input type="checkbox" class="check" value="item2" />

此代碼基於行的id和複選框的值將刪除該行：

$('.check').bind("change", function(){ 
    if($(this).is(':checked')){ 
     $('#table tr#'+$(this).val().substring(4)).remove(); 
    } 
});

這$(this).val().substring(4)將獲得前面沒有「項目」的複選框的值。如果複選框具有價值item78是要與ID刪除行78

這裏一個Fiddle

來源

2013-07-09 17:06:56

jQuery複選框和

回答

相關問題