简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

jquery操作checkbox示例分享

来源:易贤网   阅读:1018 次  日期:2014-07-24 21:22:05

温馨提示:易贤网小编为您整理了“jquery操作checkbox示例分享”,方便广大网友查阅!

checkbox操作

1. 全选、全不选

2.打印所有的选中项目

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">

<html>

 <head>

 <title> </title>

 <script type="text/javascript" src="jquery-1.3.2.js"></script>

 <script>

 // 全选、全不选

 function docChkBoxChange(){

  var isChecked = jQuery('#docChkBoxTop').attr('checked');

  // 设置以下所有的 checkBox 列表

  jQuery("input[name=docChkBox]").each(function(){

  this.checked = isChecked;

  });

 }//end function

 // 打印所有的选中项目

 function printChoose(){

  var isChecked = jQuery('#docChkBoxTop').attr('checked');

  // 设置以下所有的 checkBox 列表

  jQuery("input[name=docChkBox]").each(function(){

  if(this.checked){

  alert(this.value)

  }

  });

 }//end function

 </script>

 </head>

 <body>

 <table>

 <tr>

 <td>

  <input id='docChkBoxTop' type="checkbox" onClick='docChkBoxChange()'>全选、全不选

 </td>

 </tr>

 <tr>

 <td>

  <input name='docChkBox' type="checkbox" value='apple'>苹果

 </td>

 </tr>

 <tr>

 <td>

  <input name='docChkBox' type="checkbox" value='banana'>香蕉

 </td>

 </tr>

 <tr>

 <td>

  <input type="button" value='打印所有选中项' onClick='printChoose()'>

 </td>

 </tr>

 </table>

 </body>

</html>

更多信息请查看IT技术专栏

更多信息请查看网络编程
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:jquery常用操作小结
下一篇:jquery实现显示已选用户
易贤网手机网站地址:jquery操作checkbox示例分享
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!