• jquery 全选 反选 取消 批量删除

    首选引入jquery
    全选
    1. 	//全选
    2.     function myall(){
    3. 		$("input[name='d[]']").each(function(index,e){
    4. 		$(this).prop('checked',true);	
    5. 		});
    6. 	}
    取消
    1. 	//当true改为false时为取消
    2. //	   function no(){
    3. //		$("input[name='d[]']").each(function(index,e){
    4. //			$(this).prop('checked',false);
    5. //		});
    6. //	}
    7. 	  function no(){
    8. 		$("input[type='checkbox']").each(function(index,e){
    9. 			$(this).prop('checked',false);
    10. 		});
    11. 	}
    反选
    1. 	//反选,取得他的值然后 true 改为这个值取反即可
    2. 	  function bb(){
    3. 		$("input[name='d[]']").each(function(index,e){
    4. 			$(this).prop('checked',!$(this).prop('checked'));
    5. 		});
    6. 	}
    新闻管理页面的代码
    1. <?php
    2. include '../inc/db_mysqli.php';
    3. //删除留言信息
    4. if(isset($_GET['del'])){
    5. 	delete('hnsc_guestbook','id='.$_GET['del']);
    6. }
    7. //预处理语句查询数据
    8. $rows=query('hnsc_guestbook');
    9. ?>
    10. <!DOCTYPE html>
    11. <html>
    12.     <head>
    13.     <meta charset="utf-8">
    14.     <title>新闻管理页面</title>
    15.     <meta name="keywords" content="关键字">
    16.     <meta name="description" content="简介">
    17.     <script src="../js/j.js"></script>
    18.     <script>
    19. 	//全选
    20.     function myall(){
    21. 		$("input[name='d[]']").each(function(index,e){
    22. 		$(this).prop('checked',true);	
    23. 		});
    24. 	}
    25. 	//当true改为false时为取消
    26. //	   function no(){
    27. //		$("input[name='d[]']").each(function(index,e){
    28. //			$(this).prop('checked',false);
    29. //		});
    30. //	}
    31. 	  function no(){
    32. 		$("input[type='checkbox']").each(function(index,e){
    33. 			$(this).prop('checked',false);
    34. 		});
    35. 	}
    36. 	//反选,取得他的值然后 true 改为这个值取反即可
    37. 	  function bb(){
    38. 		$("input[name='d[]']").each(function(index,e){
    39. 			$(this).prop('checked',!$(this).prop('checked'));
    40. 		});
    41. 	}
    42.     </script>
    43.  <style>
    44. th {
    45. 	font-size: 14px;
    46. 	letter-spacing: 2px;
    47. 	background-color: #efefef;
    48. 	padding: 15px;
    49. }
    50. tr {
    51. 	background-color: #FFFFFF;
    52. }
    53. td {
    54. 	padding: 10px;
    55. 	text-align:center;
    56. 	font-size:12px;
    57. }
    58. </style>
    59.     </head>
    60.     <body>
    61. <table cellspacing="1" border="0" width="80%" bgcolor="#BFBFBF" align="center">
    62.       <tr bgcolor="#FFFFFF">
    63.     <th><input type="checkbox" onClick="aa(this)"></th>
    64.     <th>公司名称</th>
    65.     <th>留言内容</th>
    66.     <th>性别</th>
    67.     <th>联系电话</th>
    68.     <th>联系人手机号</th>
    69.     <th>地址</th>
    70.     <th>邮箱</th>
    71.     <th>留言时间及ip</th>
    72.     <th>操作</th>
    73.   </tr>
    74. <?php
    75. foreach($rows as $v){
    76. 	?>
    77. 	      <tr>
    78.      <td><input type="checkbox" name="d[]"></td>
    79.      <td><?=$v[1]?></td>
    80.     <td><?=$v[2]?></td>
    81.     <td><?=$v[3]?></td>
    82.     <td><?=$v[5]?></td>
    83.     <td><?=$v[4]?></td>
    84.      <td><?=$v[6]?></td>
    85.     <td><?=$v[7]?></td>
    87.     <td><?=date('Y-m-d H:i:s',$v[8])?><br><br><?=$v[9]?></td>
    88.     <td>
    89.     <a href="?del=<?=$v[0]?>" onClick="return confirm('是否要删除?')">删除</a>
    90.     </td>
    91.   </tr>
    92. <?php
    93. }
    94. ?>
    95. <tr>
    96. <input type="button" value="全选"  onClick="myall()">
    97. <input type="button" value="反选" onClick="bb()">
    98. <input type="button" value="取消" onClick="no()">
    99. <input type="button" value="批量删除" onClick="del()">
    100. </tr>要 
    101. </table>
    102. </body>
    103. </html>
    点击标题里面的checkbox 全选 再点击取消
    js部分代码
    1. 	//点击头部的checkbox  下面的全选中
    2. function aa(t){
    3. 	var o=document.getElementsByName('d[]');
    4. 	for(i in o){
    5. 		o[i].checked=t.checked;
    6. 	}
    7. }
    8.
    html 代码
    1.     <th><input type="checkbox" onClick="aa(this)" ></th>
    2.     <th>公司名称</th>
    1.         <input type="submit" value="批量删除">
    全选 反选 取消 批量  删除功能齐全的html 代码
    1. <?php
    2. include '../inc/db_mysqli.php';
    3. //删除留言信息
    4. if(isset($_GET['del'])){
    5. 	delete('hnsc_guestbook','id='.$_GET['del']);
    6. }
    7. //预处理语句查询数据
    8. $currpage=isset($_GET['p']) ? $_GET['p'] : 1;
    9. $rows=pager('hnsc_guestbook',$currpage,'*',10);
    10. css1();
    11. //$rows=query('hnsc_guestbook');
    12. // 控制批量删除
    13. if(isset($_GET['d'])){
    14. 	$yy=$_POST['d'];
    15. 	echo '<pre>';
    16. 	foreach($yy as $vv){
    17. 	    delete('hnsc_guestbook','id='.$vv);
    18. 	}
    19. header('location:guestbookadmin.php?p='.$_GET['p']);
    20. }
    21. ?>
    22. <!DOCTYPE html>
    23. <html>
    24.     <head>
    25.     <meta charset="utf-8">
    26.     <title>新闻管理页面</title>
    27.     <meta name="keywords" content="关键字">
    28.     <meta name="description" content="简介">
    29.      <style>
    30. th {
    31. 	font-size: 14px;
    32. 	letter-spacing: 2px;
    33. 	background-color: #efefef;
    34. 	padding: 15px;
    35. }
    36. tr {
    37. 	background-color: #FFFFFF;
    38. }
    39. td {
    40. 	padding: 10px;
    41. 	text-align:center;
    42. 	font-size:12px;
    43. }
    44. </style>
    45.     <script src="../js/j.js"></script>
    46.     <script>
    47. 	//全选
    48.     function myall(){
    49. 		$("input[name='d[]']").each(function(index,e){
    50. 		$(this).prop('checked',true);	
    51. 		});
    52. 	}
    53. 	//当true改为false时为取消
    54. //	   function no(){
    55. //		$("input[name='d[]']").each(function(index,e){
    56. //			$(this).prop('checked',false);
    57. //		});
    58. //	}
    59. 	  function no(){
    60. 		$("input[type='checkbox']").each(function(index,e){
    61. 			$(this).prop('checked',false);
    62. 		});
    63. 	}
    64. 	//反选,取得他的值然后 true 改为这个值取反即可
    65. 	  function bb(){
    66. 		$("input[name='d[]']").each(function(index,e){
    67. 			$(this).prop('checked',!$(this).prop('checked'));
    68. 		});
    69. 	}
    70. 	//点击头部的checkbox  下面的全选中
    71. function aa(t){
    72. 	var o=document.getElementsByName('d[]');
    73. 	for(i in o){
    74. 		o[i].checked=t.checked;
    75. 	}
    76. }
    77. 	
    78. 	
    79. 	
    80. 	
    81.     </script>
    83.     </head>
    84.     <body>
    85.     <form action="?d=y&p=<?=$currpage?>" method="post">
    86. <table cellspacing="1" border="0" width="80%" bgcolor="#BFBFBF" align="center">
    87.       <tr bgcolor="#FFFFFF">
    88.     <th><input type="checkbox" onClick="aa(this)" ></th>
    89.     <th>公司名称</th>
    90.     <th>留言内容</th>
    91.     <th>性别</th>
    92.     <th>联系电话</th>
    93.     <th>联系人手机号</th>
    94.     <th>地址</th>
    95.     <th>邮箱</th>
    96.     <th>留言时间及ip</th>
    97.     <th>操作</th>
    98.   </tr>
    99. <?php
    100. foreach($rows[0] as $v){
    101. 	?>
    102.     <tr>
    103.     <td><input type="checkbox" name="d[]" value="<?=$v[0]?>"></td>
    104.     <td><?=$v[1]?></td>
    105.     <td><?=$v[2]?></td>
    106.     <td><?=$v[3]?></td>
    107.     <td><?=$v[5]?></td>
    108.     <td><?=$v[4]?></td>
    109.      <td><?=$v[6]?></td>
    110.     <td><?=$v[7]?></td>
    112.     <td><?=date('Y-m-d H:i:s',$v[8])?><br><br><?=$v[9]?></td>
    113.     <td>
    114.     <a href="?del=<?=$v[0]?>" onClick="return confirm('是否要删除?')">删除</a>
    115.     </td>
    116.   </tr>
    117. <?php
    118. }
    119. ?>
    120. <tr>
    121. 	<td colspan="10">
    122.         <input type="button" value="全选"  onClick="myall()">
    123.         <input type="button" value="反选" onClick="bb()">
    124.         <input type="button" value="取消" onClick="no()">
    125.         <input type="submit" value="批量删除">
    126. </tr>
    127. <tr>
    128. 	<td colspan="10">
    129.         <?=$rows[1]?>
    130.         </td>
    131. </tr>
    132. </table>
    133. </form>
    134. </body>
    135. </html>
  • 相关阅读:
    编程填空：第i位替换
    poj 2192 Zipper
    3:拦截导弹
    vijos 1006 晴天小猪历险记之Hill——数字三角形的终极变化
    数字三角形【汇总】
    codevs 1576 最长严格上升子序列
    3299 有序数组合并求第K大问题
    输出数组第k大的元素
    Java线程同步的Monitor机制(Lock配合Condition)
    堆排序Heapsort的Java和C代码
  • 原文地址：https://www.cnblogs.com/lsr111/p/4599042.html
Copyright © 2020-2023  润新知