Web前端
zgljl2012
这个作者很懒,什么都没留下…
展开
-
HTML5 Canvas 显示不出图片
图片只要在加载完成后才能显示,需写在Image对象的onload方法里:var b = new Image();b.src = "../img/001.gif";var canvas = document.getElementById('d');var context = canvas.getContext('2d');context.save();//图片加载完成原创 2015-02-03 18:19:09 · 5076 阅读 · 0 评论 -
AngularJs实现基于角色的前端访问控制
Github 项目地址最近做的项目是使用Angular做一个单页应用,但因为用户有不同的角色(管理员、编辑、普通财务人员等),所以需要进行不同角色的访问控制。因为后端访问控制的经验比较丰富,所以这里只记录了前端访问控制的实现。请注意,前端最多只能做到显示控制!并不能保证安全,所以后端是一定要做访问控制的!基于角色的访问控制需要做到两个层面的访问控制:控制页面路由的跳转,没有权限的用户不能跳转到指定原创 2016-09-15 22:26:29 · 3285 阅读 · 0 评论 -
SVG简介
SVG全称:Scalable Vector Graphics,可伸缩矢量图形SVG既是一种文本格式,也是一种XML语言。每个SVG图像都是使用与HTML类似的标记定义的。SVG代码可以直接包含在Html中,也可以动态插入到DOM中。 支持除IE8及其之前版本外的所有浏览器。 因为SVG同时是一种XML语言,所以,要记得关闭元素 创建SVG画布创建了一个SVG元素后,可以原创 2016-08-23 09:42:36 · 1067 阅读 · 0 评论 -
Angular Js判断Object是否为空
在AngularJs中判断对象是否为空,可以使用angular.equals,如下if(obj==null||angular.equals({}, obj)) { // 为空}转载请注明 原文地址原创 2016-08-16 15:34:43 · 22777 阅读 · 0 评论 -
【Web前端 - AngularJs】$location.path改变路径需要点击两次后才会跳转
Angular的初学者。最近首次使用$location.path时,出现了一个问题,就是改变路径后$location.path('/result')需要点击两次后才会跳转。解决办法: 在后面加上$scope.$apply()$location.path('/result');$scope.$apply(); $apply() is used to execute an expression原创 2016-06-28 09:15:39 · 6579 阅读 · 0 评论 -
JavaScript 价格正则表达式
正则表达式如下:/(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/价格符合两种格式^[1-9]\d*(.\d{1,2})?$ : 1-9开头,后跟是0-9,可以跟小数点,但小数点后要带上1-2位小数,类似2,2.0,2.1,2.22等^0(.\d{1,2})?$ : 0开头,后可以跟小数点,小数点后要待上1-2位小数,类似0,0.22,0.1等代码如下(可原创 2016-04-03 22:00:44 · 16191 阅读 · 1 评论 -
【问题解决】Safari不能保存session的处理方法
我们的项目是一个单页应用,前端去访问服务器获取JSON数据,然后填充页面进行渲染,在Webkit上运行正常,但在Safari上就出现了问题,在Safari上登录的时候一直提示验证码错误,并且这是一个很麻烦的问题,因为只有将应用部署到远程服务器上才出现这个问题,本地测试是正常的。经过仔细的排查错误后,检测出是因为我们获取验证码时发起了一次Ajax连接,然后验证码存储在了session里,接着验证时又发原创 2016-03-10 12:02:17 · 11266 阅读 · 1 评论 -
【Web前端】Js利用正则表达式提取字符串
使用字符串replace函数(回调函数形式)配合正则表达式提取里面的股票代码// 使用正则表达式提取URL中的股票代码var url = "http://hq.sinajs.cn/list=sh600585,sh600985,sh600586";var regx = /sh([0-9]+)/ig;url.replace(regx, function(s, value){ console.原创 2016-01-22 23:19:41 · 5657 阅读 · 0 评论 -
【HTML5 WebSocket】WebSocket对象特性和方法
《HTML5 WebSocket权威指南》学习笔记&3WebSocket方法的对象特性1. WebSocket方法a. send方法send方法用于在WebSocket连接建立后,客户端向服务端发送消息。可分为发送两种消息,一种是普通文本信息,一种是二进制数据。需注意的是,send方法必须在连接建立以后才能使用,也就是在onopen里使用才不会出错。发送普通消息这个比较简单,在上一篇学习WebSoc原创 2015-06-04 23:09:37 · 3432 阅读 · 0 评论 -
【Html5 WebSocket】WebSocket事件
《HTML5 WebSocket权威指南》学习笔记&2上一篇:【Html5 WebSocket】WebSocket构造函数WebSocket事件WebSocket编程遵循异步编程模式,只要WebSocket的连接已打开,应用程序就开始监听事件。客户端不需要主动轮询服务器获取更多信息。下面是WebSocket对象的四个不同的监听器:openmessageerrorclose上述四个事件同所有原创 2015-05-29 14:21:21 · 3048 阅读 · 2 评论 -
【Html5 WebSocket】WebSocket构造函数
《HTML5 WebSocket权威指南》学习笔记&1在学习时WebSocket客户端API时,使用echo.websocket.org作为服务端,可以帮助学习者快速入门,减小学习难度,将较难的服务端学习延后。WebSocket构造函数WebSocket构造函数有三种,WebSocket(URL)、WebSocket(URL,protocol)、WebSocket(URL,[protocols]).原创 2015-05-28 14:39:04 · 2777 阅读 · 0 评论 -
【jQuery基础编程】jQuery-UI实现折叠面板里的控件拖曳
因一个项目的需要,需要在前端界面实现在折叠面板里拖曳控件到工作区的功能(类似于Android和MFC的可视化界面开发),于是就开始学起了强大的jQuery,发现里面的jQuery-UI有折叠面板、按钮等控件,但当在折叠面板里拖曳按钮时,按钮的拖曳范围只能是折叠面板内部,不能拖到工作区。所以这里绕了个弯实现了一下:主要的实现过程是:首先在控件表明生成一个副本,每次拖曳控件的时候拖曳的都是副本,当拖曳完原创 2015-04-25 16:58:06 · 1832 阅读 · 0 评论 -
【Web前端】jQuery界面优化
随着互联网的发展,网站的前端界面会越来越重要,它关注的是用户的直接体验。市场上同类型的网站越来越多,一个比其他同类网站更流畅、优雅的界面能让用户摈弃你的竞争对手。所以,让自己的网站前端运行的更快、界面更优美成为了一个重要的话题。从而,前端界面优化技术也成为了优秀前端开发人员必备的技能,这是核心竞争力。今天介绍的是jQuery这个流行的前端javascript开发框架里的一些优化技术,这些优化技术需要原创 2015-04-26 14:09:15 · 1810 阅读 · 0 评论 -
【HTML5与CSS3基础】开发者工具之Console
现在的浏览器往往都会有一个开发者工具用于帮助开发者构建更高效的网站。开发者工具有一个Console窗口(控制台窗口)用于输出一些调试信息,有了这个工具就总算是可以告别使用alert来调试JavaScript了。而且Console的功能远远不只是输出一下现在运行到哪了这样的简单的信息,它还可以识别不同种类的信息并且提供对应代码的超链接。开发者工具是通过把一个名为console的对象加载到全局名称空间中原创 2015-04-11 22:38:28 · 1982 阅读 · 0 评论 -
【HTML5与CSS3基础】HTML5本地存储 Web Storage
概述本地存储Web Storage实际上是HTML4的Cookies存储机制的一个改进版本。它的作用是在网站中把有用的信息存储到本地的计算机或移动设备上,然后根据需要从本地读取信息。Web Storage 有两种存储类型的API: sessionStorage localStorage 两者之间的差别在于生命周期:前者在会话期间有效;后者永久存储在本地,除非用户或程序对其执行删除操作。浏览原创 2015-04-05 15:32:52 · 1700 阅读 · 0 评论 -
【HTML5与CSS3基础】选择器querySelector和querySelectorAll
HTML5提供了两个类似JQuery的查找元素的选择器函数:querySelector和querySelectorAll,前者查找元素然后返回第一个,而后者查找元素后返回一个NodeList,里面包含了所有符合选择器的元素。 使用方法: var buttons = document.querySelectorAll(“.menu a”); 上述语句查找了类为menu且标签为a的元素,形成了一个原创 2015-03-23 20:32:05 · 1554 阅读 · 0 评论 -
JavaScript类的声明与使用
在JavaScript中,方法可以当做类来使用:首先定义一个方法,这如同一个类里面的属性使用this变量定义方法通过prototype来定义代码如下:js类示例.js:function My(){ this.hello = "hello"; //此处需用this变量,而不能只是var声明}//在对象里的prototype属性里添加 SayHello方法M原创 2015-02-10 18:05:15 · 1347 阅读 · 0 评论 -
【Vue】使用Rollup打包vue时出现process is not defined
解决办法,使用插件rollup-plugin-replace代码如下:import babel from 'rollup-plugin-babel';import resolve from 'rollup-plugin-node-resolve';import vue from 'rollup-plugin-vue';import replace from 'rollup-plugin-rep原创 2017-05-14 21:14:05 · 8372 阅读 · 0 评论