web前端
Facing_the_Giants
如果不努力,永远不知道自己有多废物!
展开
-
Nodejs
nodejs表单验证原创 2017-06-12 22:39:50 · 389 阅读 · 0 评论 -
vue2.0逻辑思维选项卡。
Hello,选项卡?很简单嘛!那项目中所有数据都是‘活’的,而不是一个静态页面怎么通过vue写出vue中的选项卡呢?页面部分:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="vue.js"></s原创 2017-08-31 10:12:44 · 1638 阅读 · 0 评论 -
vue2中的“$(this)” === JQ中$(this)--飞机票项目
Hello, 我是杨小宝!商城项目就不更新了,因为我突然换项目了!!!是不是很尴尬,不过这个项目是一个订飞机票的项目,逻辑思维也是很强的!持续更新该项目的知识点。能触及到的都是关于vue2的知识!今天给大家写一个vue中的 ‘$(this)’说起¥this,(不知道为什么不让打 美元符号我就用¥ 表示了)一想就是jq嘛,假如说在jq中我们很多li标签然后里面都有内容我们获取每一个li标签的里面的内容原创 2017-09-21 11:22:15 · 2818 阅读 · 0 评论 -
支付,配送....流程,模拟后台返回状态码 --飞机票项目
Hello,我们做项目的时候经常会遇到一些支付流程啊,配送流程啊。说白的就是一个’时间表’,虽然我这么说是‘时间表’,可能在术语上不对,我也不知道怎么解释了。 请看下图:我们要实现的效果图: 一看图,相信大家都明白了,项目中会遇到很多这种交互。 逻辑思路分析: 1.背景条跟随状态变化而变化。 2.文字内的背景色跟颜色跟随状态变化而变化那么应该怎么去考虑写代码原创 2017-09-21 16:55:07 · 547 阅读 · 0 评论 -
下拉框的年限循环(2017~1917)vue2.0--飞机票项目
Hello,项目开发过程中,需要很多项目需要是不能使用插件实现的,是需要我们通过自己去手写的。比如今天我们要实现一个下拉的年限范围。(出生日期、证件日期……)还是上图先看效果: 我们要循环出一个范围年限,分析需要的方法: 1. 我们需要v-for循环 2. 需要用到我们的计算属性 computed 3. 在JS中我们还需要用 fo原创 2017-09-22 15:54:27 · 1429 阅读 · 0 评论 -
60秒的倒计时?30分钟的倒计时!!! vue2.0 --飞机票项目
Hello,在项目中我们经常遇到 手机验证码的倒计时60秒!网上一艘一大片,为什么我们不能动脑思考去实现呢?今天分享一个倒计时30分钟的demo,也是我这个项目中遇到的一个。虽然不难,但是理解,思路最重要!上图看效果: 分析需要的方法: 1. 函数调用 ==> methods 2. 监听数据的变化 ==> watch 3. 计算属性 ==>原创 2017-09-22 16:32:24 · 7147 阅读 · 4 评论 -
localStorage本地缓存到第二个页面接收!--飞机票项目
为什么要说到localStorage呢?因为我这个项目的首页点击搜索按钮的时候,是需要跳转页面,以及将数据在第二个页面进行请求数据并渲染。 我的思路有俩种: 1.点击搜索直接传给后台生成接口后在第二个页面调用接口接受! 2.直接在前端页面本地缓存,后在第二个页面获取! 为什么我要讲一下第二种,因为后端也是有脾气的,不给你写,你也是俩眼发呆没毛病。先看一下效果图原创 2017-09-21 11:43:21 · 864 阅读 · 1 评论 -
过滤数据以及数组去重。2.0vue -- 飞机票项目
大家好! 我是杨小宝,项目马上结束,下几篇提供数据交互,以及渲染的难点。这一篇讲解过滤数据以及数组去重。效果: 在项目中,我们会经常遇到 筛选 功能,那么 既然需要筛选,我们就要用到数组的去重,数据的整理,等等。先上一张图,我们的要的效果是什么?知识: created钩子函数 数组去重 数据“中转”分析: 1.首先我们请求下的来原创 2017-10-31 10:02:36 · 3913 阅读 · 2 评论 -
Session Storage(本地缓存) -- 飞机票项目
大家好!我是杨小宝,之前写过一篇 Local Storage ,今天给大家介绍一下Session Storage区别: Local Storage 删除数据需要手动删除 Session Storage 删除数据关闭浏览器即可 (对于我们现在的需求而言,如需了解深层知识,可以去百度查看文档)用法: var storage= win原创 2017-10-23 13:44:25 · 723 阅读 · 0 评论 -
双重监听俩个值的变化 vue2.0 -- 飞机票项目
今天给写自己吧!或者说做一个笔记!就是双重监听俩个值的变化。到底是什么呢?先看截图需求: 1.点击成人 + 号 最多添加到 9 2.点击成人 - 号 最少 为 1 3.点击儿童 + 号 最多添加到 9 4.点击儿童 - 号 最少为 0 5.1个成人数量最多带俩个儿童 知识: 1.监听 2.双重判断难点: 1.我个人觉得判断确实是一个原创 2017-11-12 00:41:17 · 740 阅读 · 0 评论 -
商城项目--产品的加减中的watch监听
Hello 我是杨小宝!上一个复选框的demo写完后,我觉得还是写一下全局的watch监听吧!又不能重复写复选框,所有这里写了一个非常简单的加减的判断!看一下项目图: 就做一下 数量的加减判断即可!简单说一下项目需求: 1.当点 + 号 时 左侧 - 号 改变颜色 2.当点击 - 号 中间num值为1 时 不能点击或者说在点击也还是显示1.因为很简单!直接上代原创 2017-09-15 16:15:16 · 363 阅读 · 0 评论 -
商城项目--全选,反选 vue2.x+JQ代码(俩种实现方式)
Hello 大家好我是杨小宝!最近刚刚接手公司内一个商城项目,里面一些业务逻辑其实学习与记录一下挺好的,如果你也正好做商城类似的项目,看一下我们有相同的问题吗?首先这个全选,反选一开始做的时候我进入了一个盲区就是一直想判断 每一个checkbox选中的状态全等于true的时候 要 All => checkbox 在等于true。虽然看似很简单的一个逻辑缺让我想的很复杂!那一下看一下我们正确的代码原创 2017-09-15 15:53:17 · 435 阅读 · 0 评论 -
通过自定义属性添加样式(css+js,动态判断背景颜色)
今天我们要写一个写死的背景色,通过我们的JS把背景色变成活的。当我们通过点击 “ + ” “ - ” 号 来控制 右边 标签的 隐藏显现!!! 一开始背景色是直接写上的,点击第一个 “+” 右边就是 对应的标签 也相对应的背景颜色。后来觉得太难看了,要点击的时候背景色随着我出现的几个li标签来添加。 一行灰色,一行白色。我们就用属性来写css原创 2017-08-15 10:05:28 · 5361 阅读 · 1 评论 -
AJAX异步请求
AJAX:异步请求 法语:(通过jquery.min.js) $.ajax( { url:’xxx.php’ // 或者什么路径(node.js) data:{name:xxx,pass:xxx},//后台发送的数据,JSON形式传输 type:’get’ // 传输的方式get原创 2017-06-12 22:29:54 · 292 阅读 · 0 评论 -
php后台
PHP后台一:基本语法 1.php文件名: “xxx.php”语法:2.中文转换:header(‘cotent-type:text/html;charset=utf-8’)3.php注释:①: // ②: # ③: /* */4.执行语句:echo ==(console.log()) àecho”Hello World原创 2017-06-12 22:24:40 · 582 阅读 · 0 评论 -
jquery
JQuery1.id $(‘#box’) 可以选择标签的#id2.class $(‘.box’) 选择标签的.class3.标签obj $(‘div’) 直接获得标签4.并集选择器 $(‘#box,#box2’) 选择多个有原创 2017-06-12 22:16:34 · 354 阅读 · 0 评论 -
web前端基础文档
标签头部:head(标题) (中文)(引入css)(作者)(网页搜索关键词)(关键词下的内容介绍)(网页小图标) 身体:body (标签)(标题+字号 1~6) (文本标签) (文本内嵌标签)(文本预处理) (‘块’标签) (上标)(下标)原创 2017-06-12 21:33:43 · 617 阅读 · 1 评论 -
angular.js
Angularjs 使用angular: 1.引入框架2.声明一块angular模板 è ng-app=’app’3.使用ng-model=’xxx’,来绑定简单的数据4.应用(插值) è {{ xxx }}angular 模块化:1.声明模块 ng-app=’app’---> 声明控制器原创 2017-06-12 23:17:04 · 383 阅读 · 0 评论 -
模仿百度API接口搜索框
<!DOCTYPE html><html><head> <title>模仿百度API</title> <meta charset="utf-8"> <script type="text/javascript" src="js/vue-1.js"></script> <script type="text/javascript" src="js/vue-resourc原创 2017-06-14 19:01:22 · 3820 阅读 · 0 评论 -
Vuejs1.x - 1
一.数据的传递<div id='box'>{{msg}}</div>var v = new Vue ({ el:'#box', data:{msg:'hello vue'}})二.数据绑定 v-model<div class=’box’> <input type='text' v-model='msg'> <p>{{msg}}</p><原创 2017-07-06 18:06:54 · 313 阅读 · 0 评论 -
Vue1.x - 2
模版+组件结合1.. 模版第一种写法2..模板第二种写法3..动态组件写法,切换内容模版(选项卡)父子组件1..基本写法:2..父亲参数传递给儿子3..儿子的数据传递给父亲十四 .路由分页1):模块分区2原创 2017-07-06 18:22:38 · 400 阅读 · 0 评论 -
JQ面向对象的封装步骤
一:函数自己调用自己/*CSS页面*/ #box1{ width: 200px; height: 200px; background: red; margin :100px auto; } .box2{ width: 200px; height: 200px; ba原创 2017-07-16 15:42:49 · 2315 阅读 · 0 评论