checkbox.htm 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title></title><link href="../../lib/ligerUI/skins/Aqua/css/ligerui-all.css?332" rel="stylesheet" type="text/css" />
  5. <style type="text/css">
  6. </style>
  7. <script src="../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
  8. <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  9. <script src="../../lib/ligerUI/js/plugins/ligerCheckBox.js" type="text/javascript"></script>
  10. <script type="text/javascript">
  11. $(function () {
  12. $("#chk1").change(function () { alert(this.checked); });
  13. $('input:checkbox').ligerCheckBox();
  14. $("#btnMul").click(function () {
  15. var str = "";
  16. $("#table2 input:chekcbox").each(function () {
  17. str += this.checked + ",";
  18. });
  19. alert(str);
  20. });
  21. });
  22. </script>
  23. </head>
  24. <body style="padding:10px">
  25. <h3>示例一:单选项(触发事件)</h3>
  26. <table id="table1">
  27. <tr><td><input type="checkbox" name="chbox" id="chk1" /></td><td> 选项</td></tr>
  28. </table>
  29. <br />
  30. <h3>示例二:多选项</h3>
  31. <table id="table2">
  32. <tr><td> <input type="checkbox" name="chbox"/></td><td>选项一</td></tr>
  33. <tr><td><input type="checkbox" name="chbox"/></td><td>选项二</td></tr>
  34. <tr><td><input type="checkbox" name="chbox"/></td><td>选项三</td></tr>
  35. </table>
  36. <input type="button" id="btnMul" value="获取值"/>
  37. <div style="display:none;">
  38. </div>
  39. </body>
  40. </html>