您的位置：首页 > Web前端 > JQuery

jquery 全选 反选 取消 批量删除

2015-06-25 01:02 639 查看
首选引入jquery全选
//全选

function myall(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',true);

});

}

[/code]取消
//当true改为false时为取消

//   function no(){

//$("input[name='d[]']").each(function(index,e){

//$(this).prop('checked',false);

//});

//}

function no(){

$("input[type='checkbox']").each(function(index,e){

$(this).prop('checked',false);

});

}

[/code]反选
//反选,取得他的值然后 true 改为这个值取反即可

function bb(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',!$(this).prop('checked'));

});

}

[/code]新闻管理页面的代码
<?php

include '../inc/db_mysqli.php';

//删除留言信息

if(isset($_GET['del'])){

delete('hnsc_guestbook','id='.$_GET['del']);

}

//预处理语句查询数据

$rows=query('hnsc_guestbook');

?>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>新闻管理页面</title>

<meta name="keywords" content="关键字">

<meta name="description" content="简介">

<script src="../js/j.js"></script>

<script>

//全选

function myall(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',true);

});

}

//当true改为false时为取消

//   function no(){

//$("input[name='d[]']").each(function(index,e){

//$(this).prop('checked',false);

//});

//}

function no(){

$("input[type='checkbox']").each(function(index,e){

$(this).prop('checked',false);

});

}

//反选,取得他的值然后 true 改为这个值取反即可

function bb(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',!$(this).prop('checked'));

});

}

</script>

<style>

th {

font-size: 14px;

letter-spacing: 2px;

background-color: #efefef;

padding: 15px;

}

tr {

background-color: #FFFFFF;

}

td {

padding: 10px;

text-align:center;

font-size:12px;

}

</style>

</head>

<body>

<table cellspacing="1" border="0" width="80%" bgcolor="#BFBFBF" align="center">

<tr bgcolor="#FFFFFF">

<th><input type="checkbox" onClick="aa(this)"></th>

<th>公司名称</th>

<th>留言内容</th>

<th>性别</th>

<th>联系电话</th>

<th>联系人手机号</th>

<th>地址</th>

<th>邮箱</th>

<th>留言时间及ip</th>

<th>操作</th>

</tr>

<?php

foreach($rows as $v){

?>

<tr>

<td><input type="checkbox" name="d[]"></td>

<td><?=$v[1]?></td>

<td><?=$v[2]?></td>

<td><?=$v[3]?></td>

<td><?=$v[5]?></td>

<td><?=$v[4]?></td>

<td><?=$v[6]?></td>

<td><?=$v[7]?></td>


<td><?=date('Y-m-d H:i:s',$v[8])?><br><br><?=$v[9]?></td>

<td>

<a href="?del=<?=$v[0]?>" onClick="return confirm('是否要删除?')">删除</a>

</td>

</tr>

<?php

}

?>

<tr>

<input type="button" value="全选"  onClick="myall()">

<input type="button" value="反选" onClick="bb()">

<input type="button" value="取消" onClick="no()">

<input type="button" value="批量删除" onClick="del()">

</tr>要

</table>

</body>

</html>

[/code]点击标题里面的checkbox 全选 再点击取消js部分代码
//点击头部的checkbox  下面的全选中

function aa(t){

var o=document.getElementsByName('d[]');

for(i in o){

o[i].checked=t.checked;

}

}


[/code]html 代码
<th><input type="checkbox" onClick="aa(this)" ></th>

<th>公司名称</th>

[/code]
<input type="submit" value="批量删除">

[/code]全选 反选 取消 批量  删除功能齐全的html 代码
<?php

include '../inc/db_mysqli.php';

//删除留言信息

if(isset($_GET['del'])){

delete('hnsc_guestbook','id='.$_GET['del']);

}

//预处理语句查询数据

$currpage=isset($_GET['p']) ? $_GET['p'] : 1;

$rows=pager('hnsc_guestbook',$currpage,'*',10);

css1();

//$rows=query('hnsc_guestbook');

// 控制批量删除
if(isset($_GET['d'])){

$yy=$_POST['d'];

echo '<pre>';

foreach($yy as $vv){

    delete('hnsc_guestbook','id='.$vv);

}

header('location:guestbookadmin.php?p='.$_GET['p']);

}

?>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>新闻管理页面</title>

<meta name="keywords" content="关键字">

<meta name="description" content="简介">

    <style>

th {

font-size: 14px;

letter-spacing: 2px;

background-color: #efefef;

padding: 15px;

}

tr {

background-color: #FFFFFF;

}

td {

padding: 10px;

text-align:center;

font-size:12px;

}

</style>

<script src="../js/j.js"></script>

<script>

//全选

function myall(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',true);

});

}

//当true改为false时为取消

//   function no(){

//$("input[name='d[]']").each(function(index,e){

//$(this).prop('checked',false);

//});

//}

function no(){

$("input[type='checkbox']").each(function(index,e){

$(this).prop('checked',false);

});

}

//反选,取得他的值然后 true 改为这个值取反即可

function bb(){

$("input[name='d[]']").each(function(index,e){

$(this).prop('checked',!$(this).prop('checked'));

});

}

//点击头部的checkbox  下面的全选中

function aa(t){

var o=document.getElementsByName('d[]');

for(i in o){

o[i].checked=t.checked;

}

}





</script>


</head>

<body>

<form action="?d=y&p=<?=$currpage?>" method="post">

<table cellspacing="1" border="0" width="80%" bgcolor="#BFBFBF" align="center">

<tr bgcolor="#FFFFFF">

<th><input type="checkbox" onClick="aa(this)" ></th>

<th>公司名称</th>

<th>留言内容</th>

<th>性别</th>

<th>联系电话</th>

<th>联系人手机号</th>

<th>地址</th>

<th>邮箱</th>

<th>留言时间及ip</th>

<th>操作</th>

</tr>

<?php

foreach($rows[0] as $v){

?>

<tr>

<td><input type="checkbox" name="d[]" value="<?=$v[0]?>"></td>

<td><?=$v[1]?></td>

<td><?=$v[2]?></td>

<td><?=$v[3]?></td>

<td><?=$v[5]?></td>

<td><?=$v[4]?></td>

<td><?=$v[6]?></td>

<td><?=$v[7]?></td>


<td><?=date('Y-m-d H:i:s',$v[8])?><br><br><?=$v[9]?></td>

<td>

<a href="?del=<?=$v[0]?>" onClick="return confirm('是否要删除?')">删除</a>

</td>

</tr>

<?php

}

?>

<tr>

<td colspan="10">

<input type="button" value="全选"  onClick="myall()">

<input type="button" value="反选" onClick="bb()">

<input type="button" value="取消" onClick="no()">

<input type="submit" value="批量删除">

</tr>

<tr>

<td colspan="10">

<?=$rows[1]?>

</td>

</tr>

</table>

</form>

</body>

</html>

[/code]

来自为知笔记(Wiz)
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航