- 博客(6)
- 收藏
- 关注
原创 案例:用Ajax实现简单的多文件上传
这个小案例的静态页面比较简单,这里不贴效果图,而是放出html和css代码块。 值得一提的是,在使用Ajax请求对应的接口后,返还的是一个带有url属性的对象,这个url属性告诉我们 //HTML代码 <body> <input type="file" multiple="multiple"> <button>上传</button><br><br> <div></div> </body&g
2020-06-28 11:06:14 192
原创 对于块级作用域的理解
首先看下面一段代码。 // 给五个按钮分别注册点击事件,打印台输出当前按钮的序列号 <body> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> <button>按钮4</button> <button>按钮5</button> <script&g
2020-06-19 10:56:11 271 1
原创 案例:面向对象编程实现页面选项卡切换功能
用面向对象思想写一个tab栏切换的功能。 首先准备html结构如下: // html结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatibl
2020-06-13 14:37:26 279
原创 案例:TodoList待办事项的实现
// An highlighted block $(function() { load(); $('#title').keydown(function(e) { if (e.keyCode == 13) { if ($('#title').val().trim() == '') { alert('未输入待办事项'); return; } va
2020-06-11 21:11:10 468
原创 封装缓动动画
在做轮播图或者返回顶部功能之前,我们可能会用到动画以实现页面切换效果的流畅性,带来更好的用户体验。 下面贴一段封装好的缓动动画函数。 /**缓动动画封装 * @param: obj:做动画的元素对象 * @param: target:目标位置 * @param: callback:回调函数,用于动画执行完毕以后运行的 */ function animate(obj, target, callback) { //清除之前存在的该对象定时器消除影响 clearInterva
2020-06-01 11:24:51 189
原创 案例:全选反选按钮的实现
上图是一个全选反选按钮的案例图,有以下需求: ①点击表头复选控件的时候,表体所有复选控件的状态都为被选中; ②当表体所有复选控件都被选中的时候,勾选表头复选控件。 在日常很多项目比如购物车都有这一需求,主要采用以下代码实现。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device.
2020-05-22 18:47:03 509
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人