HTML页面

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<center>
<table>
<tr>
<th><input type="checkbox" class="che"></th>
<th>ID</th>
<th>用户名</th>
<th>分类</th>
<th>编辑</th>
</tr>
{volist name="data" id="v"}
<tr id="{$v.id}">
<td><input type="checkbox" class="check" value="{$v.id}" name=bb></td>
<td>{$v.id}</td>
<td>{$v.biao}</td>
<td>{$v.fen}</td>
<td><a href="javascript:void (0);" class="shan">删除</a></td>
</tr>
{/volist}
</table>
<button class="pi_shan">批量删除</button>
<button class="quan">全选</button>
<button class="quanbu">全不选</button>
</center>
<script src="__STATIC__/js/jquery.min.js"></script>
<script>
//批删
$(document).on("click",".pi_shan",function () {
bb=document.getElementsByName("bb");
str="";
for (var i=0;i<bb.length;i++)
{
if(bb[i].checked==true)
{
str+=","+bb[i].value
}
}
str=str.substr(1);
//请求
$.post(
"{:url('index/pi_del')}",
{
id:str
},
function (data) {
if(data==1)
{
alert("批删成功");
location.href="{:url('index/show')}"
}else if(data==2)
{
alert("批删失败");
}
}
)
})
//全选
$(document).on("click",".quan",function () {
$(".check").prop("checked",true);
})
//反选
$(document).on("click",".quanbu",function () {
$(".check").prop("checked",false);
})
//反选
$(document).on("click",".che",function () {
$(".check").each(function () {
this.checked=!this.checked;
})
})
//单删
$(document).on("click",".shan",function () {
var id=$(this).parents("tr").attr("id");
//请求
$.post(
"{:url('index/dan_shan')}",
{
id:id
},function (data) {
if(data==1)
{
document.getElementById(id).remove()
}
}
)
})
</script>
</body>
</html> PHP页面
<?php
namespace app\index\controller; use think\Controller;
use think\Db;
use think\Request; class Index extends Controller
{
public function index()
{
return '<style type="text/css">*{ padding: 0; margin: 0; } .think_default_text{ padding: 4px 48px;} a{color:#2E5CD5;cursor: pointer;text-decoration: none} a:hover{text-decoration:underline; } body{ background: #fff; font-family: "Century Gothic","Microsoft yahei"; color: #333;font-size:18px} h1{ font-size: 100px; font-weight: normal; margin-bottom: 12px; } p{ line-height: 1.6em; font-size: 42px }</style><div style="padding: 24px 48px;"> <h1>:)</h1><p> ThinkPHP V5<br/><span style="font-size:30px">十年磨一剑 - 为API开发设计的高性能框架</span></p><span style="font-size:22px;">[ V5.0 版本由 <a href="http://www.qiniu.com" target="qiniu">七牛云</a> 独家赞助发布 ]</span></div><script type="text/javascript" src="https://tajs.qq.com/stats?sId=9347272" charset="UTF-8"></script><script type="text/javascript" src="https://e.topthink.com/Public/static/client.js"></script><think id="ad_bd568ce7058a1091"></think>';
}
//展示页面
public function show()
{
$data=Db::table("title")->select();
return view("show",['data'=>$data]);
}
//单删
public function dan_shan()
{
$id=Request::instance()->param("id");
$a=Db::table("title")->where("id=$id")->delete();
if($a)
{
return 1;
}else{
return 2;
}
}
//批删
public function pi_del()
{
$id=Request::instance()->param("id");
$aa=explode(",",$id);
$a=Db::table("title")->delete($aa);
if($a)
{
return 1;
}else{
return 2;
}
}
}
 

jquery中的全选、反选、全不选和单删、批删的更多相关文章

  1. 表单javascript checkbox全选 反选 全不选

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  2. ajax全选、全不选、反选、单删/批删

    <meta charset="utf-8"> <?php //链接数据库 $link = mysqli_connect('127.0.0.1','root','r ...

  3. 【HTML5】页面点击按钮添加一行 删除一行 全选 反选 全不选

    页面点击按钮添加一行    删除一行   全选   反选  全不选 页面效果图如下 html页面代码 <!DOCTYPE html> <html> <head> & ...

  4. 表单Checkbox全选反选全不选

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. vue实现单选多选反选全选全不选

    单选 当我们用v-for渲染一组数据的时候,我们可以带上index以便区分他们我们这里利用这个index来简单地实现单选 <li v-for="(item,index) in radi ...

  6. checkbook全选/反选/全不选

    <!doctype html><html lang="en"><head> <meta charset="UTF-8" ...

  7. Jquery中对checkbox的各种“全选”或者“取消”功能实现(特别注意1.6+的一定不能使用attr来取属性了!用prop!)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. html js 全选 反选 全不选源代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  9. WPF DataGrid CheckBox 多选 反选 全选

    效果图 实现此效果的必要关键是 Style+DataTemplate 关键代码: <Window.Resources> <DataTemplate x:Key="Check ...

  10. js实现全选,反选,全不选

    思路:1.获取元素.2.用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选.3.通过if判断,如果check ...

随机推荐

  1. 学习dart从这里开始

    void main() { ; i < ; i++) { print('hello ${i + 1}'); } } // 定义个方法. printNumber(num aNumber) { pr ...

  2. 题解——牛客网OI赛制测试赛2

    T1 规律题 考虑先全部选中再去重即可 #include <cstdio> #include <algorithm> #include <cstring> #inc ...

  3. 论文笔记:Multi-Agent Actor-Critic for Mixed Cooperative-Competitive Environments

    Multi-Agent Actor-Critic for Mixed Cooperative-Competitive Environments 2017-10-25  16:38:23   [Proj ...

  4. 配置和运行 MatchNet CVPR 2015 MatchNet: Unifying Feature and Metric Learning for Patch-Based Matching

    配置和运行 MatchNet CVPR 2015 GitHub: https://github.com/hanxf/matchnet 最近一个同学在配置,测试这个网络,但是总是遇到各种问题. 我也尝试 ...

  5. Even Odds (java)

    从1到n的奇数,从1到n之间的偶数,排列在一起,找到第k个数 Input 输入包含 n and k (1 ≤ k ≤ n ≤ 1012). Please, do not use the %lld sp ...

  6. Docker网络配置概述

    Overview One of the reasons Docker containers and services are so powerful is that you can connect t ...

  7. vue.js精讲01

    笔记及源码地址 : https://github.com/wll8/vue_note 01 2017-09-13 view一个 mvvm框架(库),和 ag 类似.比较小巧,容易上手. mvc: mv ...

  8. SpringBoot学习(二)

    spring-boot-starter-parent Maven的用户可以通过继承spring-boot-starter-parent项目来获得一些合理的默认配置.这个parent提供了以下特性: 默 ...

  9. React Native的键盘遮挡问题(input/webview里)

    2017-06-15 1:使用keyVoaidView来解决 注意要设置behavio=“absolute”,哎.记性差 好像拼错了 2:使用下面的代码,监听键盘,然后将webView拉高就可以了 i ...

  10. 八皇后问题 递归实现 C语言 超详细 思路 基础

    八皇后问题 :假设 將八个皇后放到国际象棋盘上,使其两两之间无法相互攻击.共有几种摆法? 基础知识: 国际象棋里,棋盘为8X8格. 皇后每步可以沿直线.斜线 走任意格. 思路: 1.想把8个皇后放进去 ...