当前课程知识点：软件开发实训--动态网站开发 > 7 用户管理功能实现二 > 7.3单个用户删除实现 > 7.3.2单个用户删除实现
同学你好
欢迎回到软件开发实训课堂
上节课咱们把用户信息的编辑开发完成了
也给出了操作完成后的提示信息
有成功的
有错误的
那么这节课咱们来看一下
如何去删除一个用户或者多个用户呢
为了删除用户
同样的，我们需要通过列表页进入删除
所以我们先要去进入到listusers这个界面
打开模板后
我们来 在我们的编辑后面加一个
删除的超链接
同样的我们的
链接地址依然使用的是
我们的动态计算模式
和上面是一样的
两个竖线
然后加上我们的请求路径
delete
请求路径一定要和控制器对应
我们来看一下
这里边直接写了个delete
这样的话
我们再去开发别的
就显得不统一了
所以我们这里写deleteuser
下面多个删除的变成deleteusers
这样我们就能够区别开我们的每个请求路径
好
回到我们这里来
deleteuser
然后加上我们的u.uid
文字呢，我们可以写上删除
我们可以把这个红线去掉
让它禁止对html进行检查
这样呢我们就有了这个删除操作
但是删除往往是很危险的
因此上我们在删除之前尽量的提示一下
好
我们这里加一个class
写着delbtn
对于所有的删除操作
我们都加这样一个class
那么有什么好处我们就可以
统一的来提示相关操作
好
我们增加一个JS文件
在我们的js目录下
新增一个脚本文件
我们这里就叫做site js
完成
我们调用jquery的方法
来对删除按钮
添加一个点击实践
当这个按钮被点击时
我们只需要根据提示进行操作就可以了
提示的信息我们就写"确认删除吗?"
这个操作将不可恢复
就是无法恢复的破坏性的操作
一定要进行提示
然后将我们这个JS放到我们的界面中
现在我们打开浏览器来浏览一下
刷新我们的界面
然后我们点击删除
看看是否有提示
它没有提示
直接就给删除了
那说明我们的提示按钮并没有起上作用
没有起作用
我们首先来检查一下
看看是我们的class
与我们相关的脚本是否对应
检查后我们发现其实是对应的
但为什么没有起作用呢
这个原因主要是html
它是从上到下的顺序执行过程
所以当它已经解析完了这个操作后
这个函数已经定义完了
我们才去把删除解析出来
也就是删除在后面进行解析
而函数的定义在前面
这样就造成了无法给删除按钮
绑定我们需要的事件
这个怎么来处理呢
我们来在这里处理一下
首先我们把刚才出现的问题来描述一下
当标签出现在脚本代码后面时
也就是浏览器
之后才解析的标签
不能使用
我们这里来写一下绑定时间
应该使用什么呢
使用on方法
好
我们来修改一下
怎么修改呢
直接点on
进行事件的委托处理
那么委托就要使用到它的负类
我们这里因为它是表格下面的
所以我们可以用tbody
tbody下面
所有的按钮绑定这个函数
那么什么按钮呢
delbtn
这种呢就称之为委托事件绑定
称之为委托方式绑定
也叫做动态绑定
只要你后期加的都可以绑定上
现在我们再来刷新看一下
删除
依然没有绑定上
我们来看看tbody是否为它的负节点
我们把它改成td
用td作为它的负节点
td下，来绑定一个click事件
选择器是delbtn执行这个函数
这个函数执行它返回一个
true或者false
我们刷新界面来看一下
我们的脚本是否进来了
好
我们的sites已经出来了
我们来看一下setes
是不是最新的代码
好
已经获得最新代码
我们来看一下函数是否已经执行
我们新增用户
点击删除
函数并没有被执行
这样看来我们对这个代码
还是需要它负节点
也要放在这个标签的前面
我们来看一下
使用on绑定依然没有解决这个问题
我们来看一下
把它放到
因为td它依然是没有被加载进来
所以它不起作用
这也需要使用on方法称之为委托
但是on也需要标签
已经被解析才可以绑定时间
现在呢，怎么办
调用jQuery的ready函数执行
文档加载完成后
处理时间绑定
所以我们这里面需要把代码呢
放在匿名函数之中去执行
这是文档加载完成后
执行的回调函数
这样的话
我们所有的TD按钮都全已经加载完成了
所以还是要注意一下这个标签
出现脚本后面的时候
它是不能使用绑定时间的
我们这句话也给它挪一下
绑定点击事件使用on方法
就是on绑定事件称之为委托
这叫on方法
绑定事件称之为委托方式绑定
也需要标签已经被解析才可以绑定时间
那么最终我们解决方法就是
调用的jQuery的ready函数
执行文档加载完成后
再去执行时间的绑定
这样就彻底的去解决这个问题了
好
这是对于单个删除
那么当我们单个删除的时候
实际上调用的就是我们控制器里的delete方法
我们之前已经把它写好了
好
关于删除一个用户
我们就讲这么多
下节课我们再见
-1.1课程介绍
--1.1.3随堂测试
-1.2网站需求分析
--1.2.4随堂测试
-1.3网站首页分析
--1.3.3随堂测试
-1.4导航菜单分析
--1.4.3随堂测试
-1.5内容区域分析
--1.5.3随堂测试
-1.6内容副页面分析
-1.7编写需求文档
-2.1后端页面总体分析
--2.1.3随堂测试
-2.2用户管理功能设计
--2.2.3随堂测试
-2.3内容与分类功能分析
--2.3.3随堂测试
-2.4网站配置功能设计
--2.4.4随堂测试
-2.5数据库及表结构分析
-总体设计文档
-3.1前台模板约定
--3.1.3随堂测试
-3.2网站配置接口设计
--3.2.3随堂测试
-3.3菜单接口设计
--3.3.3随堂测试
-3.4内容接口设计
--3.4.3随堂测试
-3.5幻灯片接口设计
--3.5.3随堂测试
-补充设计文档
-4.1用户管理功能设计
--4.1.3随堂测试
-4.2菜单管理功能设计
--4.2.3随堂测试
-4.3内容管理功能设计
--4.3.3随堂测试
-4.4网站配置信息设计
--4.4.3随堂测试
-完成设计文档
-4.6随堂测试
-5.1开发环境搭建
--5.1.2随堂测试
-5.2Web前端环境搭建
-5.3创建用户实体
--5.3.2随堂测试
-5.4用户实体表创建与初始化
--5.4.2随堂测试
-5.5用户数据访问接口实现
--5.5.2随堂测试
-5.6环境搭建问题
-6.1用户服务层接口实现
--6.1.2随堂测试
-6.2用户列表和编辑控制器实现
--6.2.2随堂测试
-6.3用户存储和删除控制器实现
-6.4用户添加、编辑界面实现
-6.5用户管理添加用户调试
-7.1用户查询模板实现
--7.1.2随堂测试
-7.2用户信息编辑的实现
-7.3单个用户删除实现
-7.4多个用户删除实现
-8.1用户列表分页基本实现
-8.2用户列表查询结果分页实现
-8.3通用日期处理
-8.4整型日期处理
--8.4.2随堂测试
-8.5枚举数据的应用
-9.1登录逻辑实现
--9.1.2随堂测试
-9.2登录界面及流程调试
--9.2.2随堂测试
-9.3管理主界面实现
--9.3.2随堂测试
-9.4授权验证拦截器实现
--9.4.2随堂测试
-9.5拦截器调试
-10.1分类接口实现
-10.2分类添加、编辑实现
-10.3分类树结构实现
-10.4分类删除实现
--10.4.2随堂测试
-11.1内容实体定义
-11.2相关接口定义
-11.3服务接口实现
-11.4内容添加、编辑模板实现
-11.5内容添加、编辑控制器实现
-11.6内容检索页面实现
-11.7内容分类树实现
-12.1修改UEditor相关问题
-12.2整合UEditor到内容编辑界面
-12.3UEditor图片对话框应用
-12.4文件上传问题处理
-13.1网站配置相关类实现
-13.2网站配置界面模板实现
-13.3网站配置调试
-14.1网站首页布局实现
-14.2菜单Vue组件实现
--14.2.2随堂测试
-14.3幻灯片Vue组件实现
-14.4滚动Vue组件实现
--14.4.2随堂测试
-14.5滚动接口实现
-14.6滚动接口调试
-14.7幻灯片接口实现
-15.1首页区域实现
-15.2首页内容脚本实现
-15.3首页完善
-15.4Vue组件放入单文件
-15.5详细页面实现
-16.1网站测试介绍
-16.2功能测试
-16.3打包发布
-16.4部署运行
--16.4.2随堂测试
