js
hangGe0111
这个作者很懒,什么都没留下…
展开
-
js打开一个新窗口
1.code<html> <head> <title></title> <style type="text/css"> a, div { display: inline-block; margin: 10px; cursor: pointer; } </style> </head> <body> <a id="a1">windo原创 2021-04-14 21:14:11 · 1025 阅读 · 0 评论 -
html input 禁止输入中文
思路一:html input 禁止输入中文:<input type="text" class="username" οnkeyup="value=value.replace(/[\u4e00-\u9fa5]/ig,'')" placeholder="请输入账号" />输入中文时,直接替换为空格。思路二:'/[\u4e00-\u9fa5]/ig'这是匹配到中文的正则表达式,获取input的value值和这个正则匹配,如果匹配上了就给用户提示就行了(例如;在elemen.转载 2021-03-10 21:33:36 · 1409 阅读 · 1 评论 -
cookie、sessionStorage和localStorage存储方式的区别
cookie、sessionStorage和localStorage的区别一、使用方法相关1.cookie相关1.保存到本地(过期时间不设置的话默认浏览器关闭失效)function setCookie(name,value) { var Days = 30; var exp = new Date(); exp.setTime(exp.getTime() + Days*24*60*60*1000); document.cookie = name + "原创 2020-12-17 15:47:24 · 411 阅读 · 0 评论 -
js 数组 splice 和 delete 区别
1.参数:splice(index,len,item):index:起始位置;len:长度;item替换项delete member :member删除的项目2.长度:splice:删除某一项,删除所占空间,所以长度减少delete:只删除值(对应值所在位置变为undefined),不删除所占空间,所以长度不变3.删除以后:对于值变为undefined的情况可以 通过 for in循环来过滤掉无效项;或者通过 for循环和if来判断去掉无效项;4.代码:<html>原创 2020-08-11 16:38:41 · 237 阅读 · 0 评论 -
laydate.js时间日历插件
1.html<html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .txzlLi { margin...原创 2020-04-20 14:35:19 · 565 阅读 · 0 评论 -
distpicker.js制作省市区三级联动
1.html<html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .txzlLi { margin...原创 2020-04-20 13:46:37 · 821 阅读 · 0 评论 -
img图片等比压缩
1.图片的宽高处理(法一将图片等比压缩,然后居中显示,图片的容器的宽高固定)$(function(){ AutoSize($(".navdetail_l_pic-img"),458,442);})function AutoSize(Img, maxWidth, maxHeight) { var image = new Image(); image.src = Img.attr(...原创 2018-08-20 08:27:18 · 906 阅读 · 0 评论 -
div模拟select点击空白地方隐藏div(就是阻止事件冒泡,兼容ie)
1.html<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padd原创 2018-08-20 08:27:08 · 734 阅读 · 0 评论 -
js中子页面获取父页面参数,子页面调用父页面方法(一般在iframe页面用的比较多)
转载:https://www.cnblogs.com/huangshuqiang/p/5734358.html1.子页面调用父页面的方法或者变量:window.parent.方法()或者变量名window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写window.parent.aa();//调取aa函数window.parent.bb;//调取bb变量...转载 2018-08-08 17:42:43 · 5222 阅读 · 0 评论 -
在label中包裹input,同时给label添加点击事件,会发现事件执行两次
问题:在label中包裹input,同时给label添加点击事件,会发现事件执行两次;原因:input的时间冒泡解决方法:html<label id="lab"> <input type="checkbox" name="" id="che" value="" checked="true"/>check1</label>方法一:将事件绑定...原创 2018-08-15 17:28:29 · 2830 阅读 · 2 评论 -
:checked在提交时,找到所有的选中状态
1.容器里的所有(找到父容器box里的input的name为checkbox3的选中状态的元素)$('.box')..find("input[name='checkbox3']:checkbox:checked");2.将当前点击元素的状态赋给对应checkbox$(this).parents(".box").find(".checkbox3,.checkbox2").prop('ch...原创 2018-08-15 17:28:39 · 1372 阅读 · 0 评论 -
jquery checkbox选中、改变状态、change和click事件
转载:https://www.cnblogs.com/zqifa/p/jquery-checkbox-1.htmljquery判断checked的三种方法:.attr('checked); //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false.prop('checked'); //16+:true/false.is(':checked'...转载 2018-08-15 17:28:58 · 7566 阅读 · 0 评论 -
浏览器尺寸判断(兼容标准及低版本ie浏览器)
1.总体思路:先判断浏览器类型,再根据不同浏览器类型用不同方法获取浏览器尺寸;2.html<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>浏览器尺寸判断</title> </head> <原创 2018-08-15 17:29:09 · 820 阅读 · 0 评论 -
图片加载完毕执行函数
1.jsvar t_img; // 定时器var isLoad = true; // 控制变量// 判断图片加载状况,加载完成后回调isImgLoad(function() { // 加载完成});// 判断图片加载的函数function isImgLoad(callback) { // 注意我的图片类名都是cover,因为我只需要处理cover。其它图片可以不管。 /...原创 2018-08-20 08:27:46 · 1193 阅读 · 0 评论 -
将时间20180616142525换算为时间戳,获取当前时间并转为所需格式2019-01-02
1.将时间20180616142525换算为时间戳1.1html<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0;...原创 2018-08-20 08:27:54 · 926 阅读 · 0 评论 -
iosselect移动端H5的picker插件(一到多级联动,时间日历插件)
1.详情参考:https://github.com/zhoushengmufc/iosselect2.效果(1)一级级联,银行选择(http://zhoushengfe.com/iosselect/demo/one/bank.html)(2)二级级联,三国杀将领组合选(http://zhoushengfe.com/iosselect/demo/two/sanguokill.html)...原创 2018-08-22 17:47:03 · 5633 阅读 · 0 评论 -
pc端轮播图插件SuperSlide使用
1.进入官网下载(http://www.superslide2.com/downLoad.html)==》进入demo文件夹 ==》找到需要的效果;2.各个参数可查看文档详细说明:http://www.superslide2.com/param.html3.效果可查看:http://www.superslide2.com/demo.html4.说明: 属于jq插件,使...原创 2018-08-22 17:47:11 · 2103 阅读 · 0 评论 -
图片上传,生成预览图,只有一张图片
1.html<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initi原创 2018-08-22 14:37:25 · 141 阅读 · 0 评论 -
jQuery插件jquery.kxbdmarquee.js实现无缝滚动效果
转:https://www.jb51.net/article/105618.htm这篇文章主要为大家详细介绍了jQuery常用插件jquery.kxbdmarquee.js使用方法详解,具有一定的参考价值,感兴趣的小伙伴们可以参考一下1.html代码<head> <meta charset="UTF-8"> <title>滚动轮播</ti...转载 2018-09-11 19:28:51 · 1055 阅读 · 0 评论 -
cropper.js 实现HTML5 裁剪图片并上传(裁剪上传头像。)
推荐地址:1.https://blog.csdn.net/qq727013465/article/details/51823231 (博客)2.https://github.com/fengyuanchen/cropper/blob/master/README.md (GitHub)3.https://blog.csdn.net/weixin_38023551/article/deta...原创 2018-09-11 19:28:24 · 1193 阅读 · 0 评论 -
JS实现输入框类似百度搜索的智能提示效果
转:https://blog.csdn.net/yedajiang44/article/details/727582691.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">&...转载 2018-10-18 18:35:41 · 2069 阅读 · 0 评论 -
js 判断时间戳是否为同一天
场景:后台PHP给的为一组列表,产品需求是将浏览量按天展示,则需要将这一个大数组转为按天的二维数组,利用对天的循环,再每天的数据进行循环,两层嵌套比较好渲染数据。1.html<!DOCTYPE html><html> <head> <title></title> <meta http-equiv="Conten...原创 2019-01-14 16:27:58 · 6703 阅读 · 0 评论 -
js获取当前时间并做一些操作(对时间格式化,moment.js)
这个博主写的挺全的,需要的可以参考一下1.代码//Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)myDate.getMonth(); //获取当前月份(0-11,0代表1月)myDate.getDa...转载 2019-05-28 16:00:03 · 317 阅读 · 0 评论 -
echarts.js简单使用(3)
1.首先进入官方实例:http://echarts.baidu.com/examples/index.html#chart-type-pie2.查看自己需要的样例 =》 点击进入 =》点击下载 =》打开下载的html文件,删除不用的部分,修改样式,嵌入数据即可3.html<!DOCTYPE html><html style="height: 100%"...原创 2018-08-02 17:43:47 · 703 阅读 · 0 评论 -
echarts.js简单使用(2)
案例代码来自:https://www.cnblogs.com/st-leslie/p/5771241.html1.html<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-原创 2018-08-02 17:44:05 · 407 阅读 · 0 评论 -
window.btoa对字符串进行base64编码,window.atob解码成ASCII
1.html<div> encodedData:<em id="encodedData_em"></em></div><div> decodedData:<em id="decodedData_em"></em></div>2.原创 2018-08-01 18:16:26 · 653 阅读 · 0 评论 -
子页面获取父页面的参数举例
1.由2.html携带参数跳转到3.html,在3.html中通过iframe加载4.html,同时在4.html中加载5.html(就相当于2.html是 祖父[grandfather] ;3.html是 父亲[father];4.html是 儿子[son];5.html是孙子[grandson])然后在3.html中获取2.html页面跳转带过来的参数,把这个参数在4.html[son...原创 2018-08-09 08:47:48 · 5486 阅读 · 0 评论 -
在触屏端上传图片input的type="file",拖拽文字域,进行div的contenteditable="true"编辑,再将通过html2canvas.js插件将HTML生成为图片
1.html<!--最终的图片容器--><img id="jt_img" style="width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: none;"/><!--自己的画布--><canvas id="ourCanvas" style="pos原创 2018-07-30 18:23:29 · 588 阅读 · 0 评论 -
html2canvas.js将html网页保存为图片
1.html<!--最终的图片容器--><img id="jt_img" style="width: 100%;height: 100%;position: absolute;left: 0;top: 0;"/><!--自己的画布--><canvas id="ourCanvas" style="position: absolute; left...原创 2018-07-30 18:23:48 · 686 阅读 · 0 评论 -
input的type=file上传图片简单使用
1.HTML<!--预览图片--><img id="preview" /><br /><!--input的type=file实现上传文件--><input type="file" id="filePicker"/>2.jsvar upLoadControl = function() {原创 2018-07-30 18:23:55 · 2766 阅读 · 0 评论 -
js实现移动端触屏实现拖拽功能
转载:https://www.jianshu.com/p/750ca057bb3d1.html<div id="div1"></div>2.css* { margin: 0; padding: 0;}html,body { width: 100%; height: 100%;}#div1 { width: 50px; heigh...转载 2018-07-30 18:24:02 · 6117 阅读 · 0 评论 -
js运算符优先级
汇总表下面的表将所有运算符按照优先级的不同从高到低排列。优先级运算类型关联性运算符20圆括号n/a( … )19成员访问从左到右… . …需计算的成员访问从左到右… [ … ]new (带参数列表)n/anew … ( … )函数调用从左到右… ( … )18new (无参数列表)从右到左new …17后置递增(运算符在后)n/a … ++后置递减(运算符在后)… --16逻辑非从右到左! …按位...转载 2018-07-13 17:57:55 · 2490 阅读 · 0 评论 -
javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法
转载:https://blog.csdn.net/fungleo/article/details/54931379javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法前言在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝。如下图演示: 如上,arr的修改,会影响arr2的值,这显然在绝大多数情况下,并不是我们所需要的结果。 因此,数组以及对象的深拷贝...转载 2018-07-27 08:31:40 · 189 阅读 · 0 评论 -
jquery插件集
jquery插件集地址: 参考地址:http://www.jqhtml.com/category/article/plugs转载 2018-07-04 10:37:02 · 124 阅读 · 0 评论 -
jq的jsonp跨域请求
转载地址:https://blog.csdn.net/u014607184/article/details/52027879一、同源策略要理解跨域,先要了解一下“同源策略”。所谓同源是指,域名,协议,端口相同。所谓“同源策略“,简单的说就是基于安全考虑,当前域不能访问其他域的东西。一些常见的是否同源示例可参照下表:在同源策略下,在某个服务器下的页面是无法获取到该服务器以外的数据...转载 2018-07-04 10:33:37 · 337 阅读 · 0 评论 -
iframe对于点击选项卡加载问题
1.情景(1)对于点击选项卡,加载不同选项卡下的iframe里的src(2)对于不同的选项卡下的iframe的高度不同(3)第一次进入时,会初始加载一次,以后每次点击加载不同路径(4)但是加载其它路径时会发现 iframe.contentDocument.body.scrollHeight 为第一的值,一直不变的情况(5)此时可转变思路,每次点击选项卡时,先移除(empty)ifram...原创 2018-08-01 18:16:37 · 1518 阅读 · 0 评论 -
js事件冒泡和事件捕获
转载:https://www.cnblogs.com/qq9694526/p/5653728.html1.html<!--一、事件冒泡和事件捕获--><div id="parent"> <div id="child" class="child">点击child</div></div>转载 2018-08-01 18:16:47 · 754 阅读 · 0 评论 -
echarts.js简单使用(1)
转载:https://www.cnblogs.com/st-leslie/p/5771241.html一、开篇首先这里要感谢一下我的公司,因为公司需求上面的新颖(奇葩)的需求,让我有幸可以学习到一些好玩有趣的前端技术,前端技术中好玩而且比较实用的我想应该要数前端的数据可视化这一方面,目前市面上的数据可视化的框架琳琅满目,例如:D3.js、hightcharts.js、echarts.js…...转载 2018-08-02 17:43:57 · 2029 阅读 · 0 评论 -
js 转义字符及URI编码详解
转:https://www.jb51.net/article/106984.htmURL中的转义字符当URL的参数中出现诸如+,空格,/,?,%,#,&,=等特殊字符串符号时,因为上述字符有特殊含义,导致服务器端无法正确解析参数,如何处理?解决办法:将这些字符转化成服务器可以识别的字符。如果要在URL中传递特殊符号的原本意义,要对他们进行编码。编码的格式为:%加字符的ASCII...转载 2018-08-14 17:16:35 · 2232 阅读 · 0 评论 -
js获取页面跳转带过来的路径参数
1.获取函数封装//获取参数封装function GetPar(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r != null) return decodeURICo...原创 2018-06-27 16:06:44 · 4725 阅读 · 0 评论