前端
yaoyyl
这个作者很懒,什么都没留下…
展开
-
VUE 获取用户当前位置
<template> <section class="index"> <h2>获取用户当前位置</h2> <div class="">{{ errorPositionTxt }}</div> <div class="">纬度 latitude:{{ latitude }}</div> <div class="">经度 longitude:{{ longitude .原创 2020-11-07 17:43:40 · 1633 阅读 · 0 评论 -
h5唤醒app的两种方法 URL Scheme、Universal Links
1.URL Scheme[scheme:][//host:port][path][?query][#fragment]scheme : 协议名称 - 必须host : 协议地址 - 必须port : 协议的端口,可以不填path : 协议路径,可用 / 连接多个query : 携带的参数可用 & 连接多个fragment : 锚点1.1 iframefunction openApp(){var ifr = document.createElement("iframe");.原创 2020-07-16 21:59:57 · 1156 阅读 · 0 评论 -
清空文本框内容
//清空文本框内容function clearForm(form) { // input清空 $(':input', form).each(function () { var type = this.type; var tag = this.tagName.toLowerCase(); // normalize case if (t原创 2017-06-22 15:59:01 · 998 阅读 · 0 评论 -
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
原生js实现复制对象、扩展对象 类似jquery中的extend()方法原创 2017-04-26 18:30:45 · 548 阅读 · 0 评论 -
判断手机系统类型以及判断是否在微信环境
function navtype(){ var typ=''; var u = navigator.userAgent; if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机 typ='a'; } else if (u.indexOf('iPhone') > -1) {//苹果原创 2016-07-26 14:07:45 · 2997 阅读 · 0 评论 -
vue-cli 脚手架
初始化 webpack 项目vue init webpack my-projectnpm run dev直接在本地调试npm run build编译原创 2017-05-02 18:04:15 · 227 阅读 · 0 评论 -
头部 meta 设置
启用360浏览器的极速模式(webkit) -->meta name="renderer" content="webkit"> 避免IE使用兼容模式 -->meta http-equiv="X-UA-Compatible" content="IE=edge"> 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓 -->meta name="HandheldFri原创 2017-05-03 14:31:57 · 371 阅读 · 0 评论 -
node 常用命令
安装模块命令 npm install moduleName –save npm install moduleName npm install npm startexpress创建项目目录 express projectname 指定ejs引擎模板 express -e ejs projectname 修改app.js文件 // view engine setup app原创 2016-11-07 18:11:22 · 1589 阅读 · 0 评论 -
js将当前时间日期格式化输出
Date.prototype.format = function (format) { var o = { "M+": this.getMonth() + 1, //month "d+": this.getDate(), //day "h+": thi原创 2016-08-29 12:12:53 · 3076 阅读 · 0 评论 -
验证码倒计时
/* * 验证码倒计时* 在标签上加ID 和 data-mescode="true" */ var wait=60; function time(o) { if (wait == 0) { o.setAttribute("data-mescode", tru原创 2017-02-14 10:13:59 · 243 阅读 · 0 评论 -
利用jquery制作滚动到指定位置触发动画
利用jquery制作滚动到指定位置触发动画*{ margin:0px; padding:0px;}.gs{position:relative;top:800px; background-color:#099; left:150px; width:80px; }.xz{animation:roate 2s;animation-fill-mode原创 2016-05-13 17:09:58 · 7920 阅读 · 2 评论 -
返回两个日期之间的所有时期
/** 返回两个日期之间的所有时期* 如 dataScope('2017-08-01','2017-08-10')* 返回 ["2017-8-01", "2017-8-02", "2017-8-03", "2017-8-04", "2017-8-05",* "2017-8-06", "2017-8-07", "2017-8-08", "2017-8-09", "2017-8-原创 2017-08-08 18:21:56 · 386 阅读 · 0 评论 -
获取浏览器URL中查询字符串中的参数
// https://www.baidu.com?name=xiaoming&age=23function showWindowHref(){ var sHref = window.location.href; var args = sHref.split('?'); if(args[0] == sHref){ return ""; }...原创 2018-04-02 11:41:51 · 1674 阅读 · 0 评论 -
拖动滑块验证JS
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"> <met原创 2018-03-13 17:34:02 · 1347 阅读 · 0 评论 -
购物车水平抛物线动画
效果:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.原创 2018-03-01 17:12:39 · 531 阅读 · 0 评论 -
基于SVG.JS的彩票开奖折线图
基于SVG.JS的彩票开奖折线图 /** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */ html, body, div, span, applet, object, iframe, h1, h2,原创 2018-02-05 17:26:12 · 2380 阅读 · 1 评论 -
CSS 三角形 单行文字长度 多行文字长度
三角形/*向上*/.triangle_border_up{ width:0; height:0; border-width:0 30px 30px; border-style:solid; border-color:transparent transparent #333;/*透明 透明 灰*/原创 2016-09-30 11:47:36 · 761 阅读 · 0 评论 -
搜索时去掉所有特殊字符
function replaceIllegalStr(str) { var reg; var illegal_list = ["/", "\\", "[", "]", "{", "}", "", "<", ">", "「", "」", ":", ";", "、", "•"原创 2017-12-05 16:11:06 · 8884 阅读 · 0 评论 -
HTML转义字符,HTML字符实体< >: &
/** * @function escapeHTML 转义html脚本 & " ' * @param a 字符串 */function escapeHTML(a){ a = "" + a; return a.replace(/&/g, "&").replace(//g, ">").replace(/"/g, """).replace(/'/g, "'");;}原创 2017-12-10 12:40:51 · 5883 阅读 · 1 评论 -
文本框实时搜索
html> charset="UTF-8"> 文本框实时搜索id="searchInp" type="text" placeholder="请输入">id="test">src="http://apps.bdimg.com/libs/zepto/1.1.4/zepto.min.js"> $(document).ready(function(){原创 2017-07-24 16:53:59 · 1030 阅读 · 0 评论 -
js简单的图片转base64
/* * 上传图片 */ function FileInput() { document.getElementById('fielinput').addEventListener('change', function() { var file = this.files[0]; //判断文件类型 v原创 2017-02-14 14:05:13 · 2168 阅读 · 0 评论 -
本地数据 根据输入条件进行检索数据
/*根据输入条件进行检索数据** conditions 检索条件* searchArr 检索原数据** */function setSearch(conditions,searchArr){ var j=0; var localData = { data : Array(), get : function(key){原创 2017-02-21 11:45:29 · 776 阅读 · 0 评论 -
js canvas 波浪
波浪*{margin: 0;padding: 0;}.waveBox{width: 100%;height: 200px;position: relative;overflow: hidden;}.waveBox canvas{position: absolute;top: 0;left: 0;}#myCanvas1{z-index:原创 2017-02-28 15:20:43 · 2207 阅读 · 1 评论 -
JS正则方法判断邮箱号码,手机号码,电话号码
第二种方法:原创 2016-06-01 10:55:58 · 3033 阅读 · 0 评论 -
CSS常见兼容性问题总结
浏览器的兼容性问题,通常是因为不同的浏览器对同一段代码有不同的解析,造成页面显示不统一的情况。这里谈到的浏览器,主要指IE6/IE7/IE... FireFox Chrome Opera Safari 等。 但更多的兼容还是考虑IE6/IE7/FF之间的斗争先来谈谈CSS Hack我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样式,所以我们原创 2016-05-06 15:40:50 · 782 阅读 · 0 评论 -
常见浏览器兼容性问题与解决方案
所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况。在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。文章主要针对的是第一类,严谨型的开发人员,因此这里主要从浏览器解析差异的角度来分析兼容性问题。(相关文章推荐:主流浏原创 2016-05-06 15:33:46 · 413 阅读 · 0 评论 -
让DIV标签中的P标签水平和垂直都居中
让DIV标签中的P标签水平和垂直都居中div { width:400px; height:300px; border:1px solid #666; overflow:hidden; position:relative; display:table-cell; text-align:center; vertical-align:middle;原创 2016-01-20 15:05:52 · 73778 阅读 · 2 评论 -
jQuery .bind() .live() .delegate() .on() .off() 方法不同与联系
.bind()假设有一个多行多列的表格,我们想让用户单击每个单元格都能看到与其中内容相关的更多信息(比如,通过提示条)。为此,可以为每个单元格都绑定click事件:$("info_table td").bind("click", function(){/*显示更多信息*/});问题是,如果表格中要绑定单击事件的有10列500行,那么查找和遍历5000个单元格会导致脚本执行速度明原创 2016-02-23 11:41:56 · 388 阅读 · 0 评论 -
HTML 简单方法 返回顶端
返回顶端这样就能简单实现原创 2016-01-20 13:35:33 · 568 阅读 · 0 评论 -
QQ无需加好友临时会话
一共有三种需要添加好友http://wpa.qq.com/msgrd?v=3&uin=QQ号&site=qq&menu=yes能弹出临时会话框,但是要想聊天还得添加好友tencent://message/?Menu=yes&uin=QQ号&Site=xxx&Service=10&sigT=10&sigU=10能弹出临时会话原创 2016-01-20 13:34:26 · 2129 阅读 · 0 评论 -
去掉超链接点击时出现虚线框
去掉超链接点击时出现虚线框a:focus{outline:none;}超链接hidefocus 兼容ie6a:focus兼容火狐一起用就全都没有了原创 2016-01-20 13:32:50 · 322 阅读 · 0 评论 -
JQUERY阻止表单提交
$("form").submit(function(e){ e.preventDefault(); });原创 2016-01-20 13:31:21 · 319 阅读 · 0 评论 -
阻止事件冒泡\阻止默认行为
e.stopPropagation(); // 阻止事件冒泡e.preventDefault(); //阻止默认行为 ( 表单提交 )原创 2016-07-26 15:12:10 · 239 阅读 · 0 评论 -
JSPDF插件 把HTML转PDF
使用JSPDF插件,把HTML页面转成PDF原创 2016-07-15 14:03:18 · 2400 阅读 · 0 评论 -
去掉手机页面a标签点击跳转时出现的样式改变
在公共样式里加入以下样式就可以了a:link{color:inherit;text-decoration:none;}a:visited{color:inherit;text-decoration:none;}a:hover{color:inherit;text-decoration:none;}a:active{color:inherit;text-decoration:none原创 2016-03-15 16:26:36 · 935 阅读 · 0 评论 -
阿拉伯数字转换为简写汉字 JS
//阿拉伯数字转换为简写汉字function ArabiSimplified(Num) { for (var i = Num.length - 1; i >= 0; i--) { Num = Num.replace(",", "")//替换Num中的“,” Num = Num.replace(" ", "")//替换Num中的空格 } if原创 2017-01-17 19:45:07 · 2508 阅读 · 0 评论 -
jQuery实现CheckBox全选、全不选
jQuery实现CheckBox全选、全不选 $(function() { $(':checkbox').click(function(evt){ // 阻止冒泡 evt.stopPropagation(); }); //判断是否全选 $("#checkAll")原创 2017-01-11 09:46:22 · 566 阅读 · 0 评论 -
html标签位置
绝对位置坐标:$("#elem").offset().top$("#elem").offset().left相对父元素的位置坐标:$("#elem").position().top$("#elem").position().left原创 2016-10-20 09:54:38 · 776 阅读 · 0 评论 -
zepto+css3提示窗口效果
zepto+css3提示窗口效果*{margin: 0;padding: 0;}/*提示窗口css*/.promptBox{position: relative;z-index: 99;}.proBj{position: fixed;z-index:90;width: 100%;height: 100%;top: 0;left: 0;background-color: #000原创 2016-09-22 14:29:59 · 1749 阅读 · 0 评论 -
常用且实现的JS小插件
插件描述:aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件。该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果。在页面往回滚动时,元素会恢复到原来的状态。原创 2016-10-10 14:45:27 · 1232 阅读 · 0 评论