Jquery複選框多選和行選擇

請參閱下面的代碼和屏幕，實際上它是一個配置屏幕。Jquery複選框多選和行選擇

雖然點擊Fieldname複選框，它將選中所有的複選框，如果我們刪除了一個複選框，它將取消選中所有複選框。
單擊Field1複選框。子控件將被選擇爲（添加，編輯，刪除），如果我們刪除一個檢查，它將取消選擇複選框。
我的問題是如何能做到這一點的操作，以及如何得到的值
我使用jQuery執行此操作
的所有值均爲來自數據庫的動態領域。

請幫我解決這個問題。其迫切

<table width="100%"> 
     <tr style="background: #999; color: #FFF;"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="Checkbox1" /> 
       <label for="field_name" class="checkboxlabel"> 
        Field Name</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox2" /> 
       <label for="default" class="checkboxlabel"> 
        Add</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox3" /> 
       <label for="default" class="checkboxlabel"> 
        Edit</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox4" /> 
       <label for="default" class="checkboxlabel"> 
        Delete</label> 
      </td> 
     </tr> 
     <tr class="row1"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_1" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 1</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox5" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox6" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox7" /> 
      </td> 
     </tr> 
     <tr class="row2"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_1" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 2</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox8" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox9" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox10" /> 
      </td> 
     </tr> 
    </table>

來源

2011-12-27 sathish kumar

歡迎SO。請不要使用「緊急」等字樣。你可能會得到反對票 – naveen 2011-12-27 06:31:52

你有什麼嘗試過，哪些是行不通的？我們在這裏處理破碎的代碼，而不是請求。 – Blender 2011-12-27 06:34:05

我試着檢查所有的工作。我不知道如何選擇特定的行？ – 2011-12-27 06:37:42

請給像id="mytable"一個ID，你的表，並使用此代碼

$("#mytable tr:first input[type=checkbox]").click(function() { 
    var selector = $("#mytable td:first-child input[type=checkbox]") 
    if (this.checked) { 
     $(selector).attr("checked", "checked"); 
    } 
    else { 
     $(selector).removeAttr("checked"); 
    } 
});

工作演示：http://jsfiddle.net/naveen/ETKqx/

來源

2011-12-27 07:13:29 naveen

<script> 
    $(document).ready(function() { 
     $("table tr:first input[type=checkbox]").click(function() { 
      var selector = "input[type=checkbox]:[name=" + $(this).attr("name") + "]"; 
      $(selector).attr("checked", $(this).attr("checked")); 
     }); 
    }); 
</script> 
<table width="100%"> 
     <tr style="background: #999; color: #FFF;"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="Checkbox1" /> 
       <label for="field_name" class="checkboxlabel"> 
        Field Name</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox2" /> 
       <label for="default" class="checkboxlabel"> 
        Add</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox3" /> 
       <label for="default" class="checkboxlabel"> 
        Edit</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox4" /> 
       <label for="default" class="checkboxlabel"> 
        Delete</label> 
      </td> 
     </tr> 
     <tr class="row1"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 1</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox5" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox6" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox7" /> 
      </td> 
     </tr> 
     <tr class="row2"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 2</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox8" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox9" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox10" /> 
      </td> 
     </tr> 
    </table>

來源

2011-12-27 06:50:57

Jquery複選框多選和行選擇

回答

相關問題