JavaScript 技巧之 Checkbox Group

This library lets you quickly and easily make multiple checkboxes behave as a group by limiting the total number of boxes that can be checked and/or have a master control checkbox.

 

 

 

1. var dayGroup = new CheckBoxGroup();
2. dayGroup.addToGroup("day[]");
3. dayGroup.setControlBox("alldays");
4. dayGroup.setMasterBehavior("all");

var dayGroup = new CheckBoxGroup();
dayGroup.addToGroup("day[]");
dayGroup.setControlBox("alldays");
dayGroup.setMasterBehavior("all");

 

 

1. <form>
2. <input name="alldays" value="ALL" onclick="dayGroup.check(this)" type="checkbox" />
3. All<br> <input name="day[]" value="Monday" onclick="dayGroup.check(this)" type="checkbox" />
4. Monday<br> <input name="day[]" value="Tuesday" onclick="dayGroup.check(this)" type="checkbox" />
5. Tuesday<br> <input name="day[]" value="Wednesday" onclick="dayGroup.check(this)" type="checkbox" />
6. Wednesday<br> <input name="day[]" value="Thursday" onclick="dayGroup.check(this)" type="checkbox" />
7. Thursday<br> <input name="day[]" value="Friday" onclick="dayGroup.check(this)" type="checkbox" />
8. Friday<br> <input name="day[]" value="Saturday" onclick="dayGroup.check(this)" type="checkbox" />
9. Saturday<br> <input name="day[]" value="Sunday" onclick="dayGroup.check(this)" type="checkbox" />
10. Sunday<br>
11. </form>

<form>
  <input name="alldays" value="ALL" onclick="dayGroup.check(this)" type="checkbox" />
  All<br>  <input name="day[]" value="Monday" onclick="dayGroup.check(this)" type="checkbox" />
  Monday<br>  <input name="day[]" value="Tuesday" onclick="dayGroup.check(this)" type="checkbox" />
  Tuesday<br>  <input name="day[]" value="Wednesday" onclick="dayGroup.check(this)" type="checkbox" />
  Wednesday<br>  <input name="day[]" value="Thursday" onclick="dayGroup.check(this)" type="checkbox" />
  Thursday<br>  <input name="day[]" value="Friday" onclick="dayGroup.check(this)" type="checkbox" />
  Friday<br>  <input name="day[]" value="Saturday" onclick="dayGroup.check(this)" type="checkbox" />
  Saturday<br>  <input name="day[]" value="Sunday" onclick="dayGroup.check(this)" type="checkbox" />
  Sunday<br>
</form>

DEMO：http://www.phphi.cn/demo/checkboxgroup/

转载于:https://blog.51cto.com/kebin/514067