五、回收站--制作

本文描述了网页表格的设计细节,包括根据数据有无控制清空和批量删除按钮的状态,搜索功能如何影响表格内容,以及日期选择和搜索框对数据的过滤。同时,提到了复选框的全选与单选功能的实现,并强调了CSS中calc函数的使用规则,用于动态计算长度值。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

页面: 

一、表格上方:清空按钮、批量删除按钮

清空按钮:通过 表格有没有数据,控制按钮 可用、禁用

批量删除按钮:通过 表格有没有勾选数据,控制按钮 可用、禁用

 

 搜索时,把勾选的去掉,并重新 获取表格数据

二、刷新按钮--刷新时,让页面搜索框、等 都清除内容

三、日期、搜索框 都可以搜索 表格数据

 1、搜索框--实现搜索--绑定的是 名称

!重点:方法中 获取数据的方法,搜索框 传参为--输入的选项的名称

2、日期框--实现搜索----绑定的是 日期

四、表格--复选框控制的 方法--页面中 用同一个方法实现

checkbox-change--对应列表中的每一个复选框

checkbox-all--对应列表中,控制全选的复选框

页面中 用同一个方法实现

样式:

 一、css中的calc函数--用于动态计算长度值。

1、注意:运算符前后 都需保留一个空格,不然不生效。

如:width: calc(100% - 10px);
2、任何长度值都可以使用calc()函数进行计算;
3、calc()函数支持 "+", "-", "*", "/" 运算;
4、calc()函数使用标准的数学运算优先级规则;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值