jquery操作checkbox示例分享
來源:易賢網(wǎng) 閱讀:1362 次 日期:2014-07-24 21:22:05
溫馨提示:易賢網(wǎng)小編為您整理了“jquery操作checkbox示例分享”,方便廣大網(wǎng)友查閱!

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技術專欄

更多信息請查看網(wǎng)絡編程
易賢網(wǎng)手機網(wǎng)站地址:jquery操作checkbox示例分享
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點

版權所有:易賢網(wǎng)