分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

jquery实现分页+单删批删

发布时间:2023-09-06 02:35责任编辑:熊小新关键词:暂无标签

//定义一个分页的方法
???public function fenye(){
???????//查询满足条件的总条数
???????$count = M("regis")->count();
???????//设置每页显示的条数
???????$length = 3;
???????//求出总页数
???????$zong_page = ceil($count/$length);
???????//接收一下当前页
???????$page = empty($_GET[‘page‘])? 1 : $_GET[‘page‘];
???????//求出偏移量
???????$limit = ($page-1)*$length;
???????//求出每页的数据
???????$data = M("regis")->limit($limit,$length)->select();
???????//拼接数组
???????$arr[‘list‘] = $data;
???????$arr[‘home_page‘] = 1;
???????$arr[‘last_page‘] = $zong_page;

???????$this->assign(‘arr‘,$arr);
???????$this->display(‘show‘);


???}


???public function fy(){
???????//查询满足条件的总条数
???????$count = M("regis")->count();
???????//设置每页显示的条数
???????$length = 3;
???????//求出总页数
???????$zong_page = ceil($count/$length);
???????//接收一下当前页
???????$page = empty($_GET[‘page‘])? 1 : $_GET[‘page‘];
???????//求出偏移量
???????$limit = ($page-1)*$length;
???????//求出每页的数据
???????$data = M("regis")->limit($limit,$length)->select();
???????//拼接数组
???????$arr[‘list‘] = $data;
???????$arr[‘home_page‘] = 1;
???????$arr[‘last_page‘] = $zong_page;

???????echo json_encode($arr);
???}


???//定义一个批量删除的方法
???public function delAll(){
???????//接收传值
???????$ids = I(‘get.id‘);
???????//拼接条件
???????$where[‘id‘] ?= array(‘in‘,$ids);
???????if(M("regis")->where($where)->delete()){
???????????echo 1;//成功输出1
???????}else{
???????????echo 2;//失败输出2
???????}
???}

<!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>
<table border="1">
???<tr>
???????<th>选择</th>
???????<th>ID</th>
???????<th>用户名</th>
???????<th>密码</th>
???????<th>邮箱</th>
???????<th>昵称</th>
???????<th>注册时间</th>
???</tr>

???<tbody id="tb">
???????<foreach name="arr.list" item="v">
???????????<tr id="{$v.id}">
???????????????<td><input type="checkbox" name="check" value="{$v.id}"></td>
???????????????<td>{$v.id}</td>
???????????????<td fd="uname">{$v.uname}</td>
???????????????<td fd="pwd">{$v.pwd}</td>
???????????????<td fd="email">{$v.email}</td>
???????????????<td fd="nickname">{$v.nickname}</td>
???????????????<td>{$v.add_time|date="Y-m-d H:i:s",###}</td>
???????????</tr>
???????</foreach>
???</tbody>
</table>
<!--当前页-->
<input type="hidden" name="current_page" id="current_page" value="{$arr.home_page}">
<!--尾页-->
<input type="hidden" name="last_page" id="last_page" value="{$arr.last_page}">

<a href="javascript:void(0);" class="page">首页</a>
<a href="javascript:void(0);" class="page">上一页</a>
<a href="javascript:void(0);" class="page">下一页</a>
<a href="javascript:void(0);" class="page">尾页</a>
<button id="del">删除</button>


<script src="__PUBLIC__/js/jquery.js"></script>
<script>
???//给删除按钮一个点击事件
???$("#del").click(function(){
???????//定义一个空的数组
???????var arr = [];
???????//定位一下选中的多选框
???????$("[type=checkbox]:checked").each(function(i){
???????????arr[i] = $(this).val();
???????});

???????var ids = arr.toString();

???????//发起请求
???????$.get("{:U(‘Exam/delAll‘)}?id="+ids,function(data){
???????????if(data==1){
???????????????//成功
???????????????for(var i=0;i<arr.length;i++){
???????????????????$("#"+arr[i]).remove();
???????????????}
???????????}else{
???????????????//失败
???????????????alert(‘删除失败‘);
???????????????return false;
???????????}
???????});
???});


???$(".page").click(function(){
???????//获取当前页
???????var current_page = $("#current_page").val();
???????//获取一下最后一页
???????var last_page = $("#last_page").val();

???????//获取a标签的值
???????var a_val = $(this).text();

???????//判断页数
???????if(a_val==‘首页‘){
???????????var page = 1;
???????}else if(a_val==‘上一页‘){
???????????var page = parseInt(current_page)-1 <= 1 ? 1 : parseInt(current_page)-1;
???????}else if(a_val == ‘下一页‘){
???????????var page = parseInt(current_page)+1 >= last_page ? last_page : parseInt(current_page)+1;
???????}else{
???????????var page = last_page;
???????}

???????//请求
???????$.get("{:U(‘Exam/fy‘)}?page="+page,function(data){
???????????//把拿到的数据转化成真正的json
???????????var res = JSON.parse(data);
???????????var arr = res.list;
???????????var str = ‘‘;
???????????// console.log(arr);
???????????for(var i=0;i<arr.length;i++){
???????????????str += "<tr>";
???????????????str += "<td><input type=‘checkbox‘ name=‘check‘ value=‘"+arr[i].id+"‘></td>";
???????????????str += "<td>"+arr[i].id+"</td>";
???????????????str += "<td>"+arr[i].uname+"</td>";
???????????????str += "<td>"+arr[i].pwd+"</td>";
???????????????str += "<td>"+arr[i].email+"</td>";
???????????????str += "<td>"+arr[i].nickname+"</td>";
???????????????str += "<td>"+arr[i].add_time+"</td>";
???????????????str +="</tr>";
???????????}

???????????$("#tb").html(str);
???????????$("#current_page").val(page);

???????});
???});

???// //先加载页面、再加载jq部分
???// $(document).ready(function () {
???// ????//给每一个td一个双击事件
???// ????$("td").dblclick(function () {
???// ????????//取td这个标签的内容
???// ????????var td_val = $(this).text();
???// ????????//获取要修改的数据库字段
???// ????????var td_attr_val = $(this).attr("fd");

???// ????????//判断不支持的内容部分
???// ????????if(td_attr_val==undefined){
???// ????????????alert(‘不支持修改这个内容‘);
???// ????????????return false;
???// ????????}

???// ????????//继续,支持的了
???// ????????//获取自增id
???// ????????var tr_val = $(this).parents().attr("id");

???// ????????//想办法变成文本框
???// ????????$(this).html("<input type=‘text‘ id=‘cli"+td_val+"‘ value=‘"+td_val+"‘>");

???// ????????//文本框失效事件
???// ????????$("#cli"+td_val).blur(function () {
???// ????????????//获取新值
???// ????????????var new_val = $(this).val();

???// ????????????//请求后台
???// ????????????$.post("{:U(‘Exam/jdjg‘)}",
???// ????????????????{
???// ????????????????????//自增id
???// ????????????????????id:tr_val,
???// ????????????????????//字段名
???// ????????????????????fd_name:td_attr_val,
???// ????????????????????//字段的最新值
???// ????????????????????new_val:new_val
???// ????????????????},
???// ????????????????function(data){
???// ????????????????????//直接替换文本框
???// ????????????????????$("#cli"+td_val).parents("td").html(new_val);
???// ????????????????});
???// ????????});

???// ????});
???// });
</script>
</body>
</html>

jquery实现分页+单删批删

原文地址:https://www.cnblogs.com/DXYHW/p/10551026.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved