前端学习笔记
denglishang
此人不懒,就是不想写简介……
展开
-
Vue.js学习笔记——处理用户输入(逆转消息)
源代码地址:https://cn.vuejs.org/v2/guide/#headerdemo.html {{ message }} 逆转消息 var app = new Vue(转载 2018-02-06 10:58:58 · 576 阅读 · 0 评论 -
baiduTemplate模板应用实例
JS用KISSY基础代码:(提前下载baiduTemplate.js文件)<!DOCTYPE html><html lang="en"><head> <meta charset="GBK"> <title>baidutemplate模板应用</title> &原创 2018-07-30 23:47:28 · 374 阅读 · 0 评论 -
倒计时显示与控制
在前台功能开发的过程中可能会遇到这种情况:多个订单商品的列表,点击查看详情,里面有对应的商品活动时间的倒计时,如果点击查看不是刷新整个页面的话,需要在查看详情返回列表时将倒计时关闭掉。否则就会出现如下这种情况:多个倒计时同时运行,导致页面显示出错。方案一:简单模拟类似情形,做了一个简单的活动剩余时间页面:其中“停止”按钮可以代替商品详情里的返回按钮,点击“停止”后:...原创 2018-07-30 16:56:58 · 1341 阅读 · 0 评论 -
表单提交loading加载提示效果
提交表单后,有时候会需要一定的响应时间,比如说,若需要往很多表里面插入数据,可能会出现点击提交后,服务器响应还未返回,在一定时间内浏览器毫无反应,会给用户造成错觉,以为系统是不是崩了,这就很尴尬啦。因此,可以自定义在提交表单后添加一个loading效果。来来来,先附一张动图:CSS:.submit_loading { position:fixed; wi...原创 2018-07-30 14:05:12 · 13228 阅读 · 0 评论 -
Vue.js学习笔记——路由实现选项卡简单实例
需要实现下图效果,点击上方选项卡,切换到不同内容的组件: 事先准备好两个库文件(vue.js、vue-router.js),放到对应路径。1.引入依赖库<script src="vue.js" type="text/javascript" charset="GBK"></script><script src="vue-router.js"原创 2018-06-27 15:19:21 · 1674 阅读 · 0 评论 -
HTML autocomplete="off
当用户在字段开始键入时,浏览器不会基于之前键入过的值显示在字段中填写的选项。<input autocomplete="off" />原创 2018-05-23 16:08:13 · 792 阅读 · 0 评论 -
KISSY——事件Event.fire
问题:在JS文件中,有时候会出现这样的问题:事件明明已经定义有了,但是浏览器在解析JS文件时却找不对应事件,以至于无法触发指定事件,得不到相应的页面效果。例如:在一个JS文件中,代码如下:……//(省略n行代码)Event.fire("#more","click");//预想在浏览器第一次解析改JS文件时,触发该事件……//(再省略n行代码)Event.on("#more","click",fun...原创 2018-05-23 15:59:24 · 635 阅读 · 0 评论 -
HTML中readonly与disabled的异同
相同点:readonly和disabled的作用是使用户不能够更改表单域中的内容,都可以防止用户键入.不同点:1.dsiabled使文本框及字体变灰,readonly则不会.2.readonly只对input(text/password)和textarea有效,而disabled对于所有的表单元素有效,包括select,radio,checkbox,button等.3.在表单元素使用了disabl...原创 2018-05-23 15:21:26 · 323 阅读 · 0 评论 -
ES6学习笔记(1)
Set 实例的属性和方法Set 结构的实例有以下属性:Set.prototype.constructor:构造函数,默认就是Set函数。Set.prototype.size:返回Set实例的成员总数。Set 实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。下面先介绍四个操作方法:add(value):添加某个值,返回 Set 结构本身。delete(value):删除某个...原创 2018-05-23 14:54:54 · 161 阅读 · 0 评论 -
Vue.js学习笔记——tabs标签页
参考地址:https://jsfiddle.net/2kn4hqts/demo.html .active { color: #409EFF; border-bottom: 1px solid #409EFF; border-bottom-color: #f转载 2018-02-07 15:30:41 · 1896 阅读 · 0 评论 -
Vue.js学习笔记——简单事件处理
引用代码来源:https://cn.vuejs.org/v2/guide/demo.html: {{ todo.text }} X转载 2018-02-06 11:24:09 · 251 阅读 · 0 评论 -
Echarts堆叠条形图——各班在各个月份男生、女生迟到次数统计
提前准备好echarts.js官网下载地址:http://echarts.baidu.com/download.html先定义一个data,用来存需要统计的数据(可以看做是请求返回的JSON数据):var data = {"month_start":"2017-11" ,"month_end":"2018-04","resultlist":[{"time":"2原创 2018-07-31 22:55:37 · 1883 阅读 · 0 评论