打包HTMLAPP href来回跳转的问题

2020-06-16 21:00:26 阅读：1989

functionlocationReplace(url){ if(history.replaceState){ history.replaceState(null,document.title,url); history.go(0); }else{ location.replace(url); } } 跳转

js倒计时方法（青哥总结）

2019-06-25 08:49:06 阅读：2272

js代码： functioncountDown(obj,endTime){ vartime_start=newDate().getTime();//设定当前时间 vartime_end=parseInt(endTime);//设定目标时间 //计算时间差 vartime_distance=time_end-time_start; //天 varint_day=Math.floor(time_distance/86400000); time_distance-=int_day*86400000; //时 varint_hour=Math.floor(time_distance/3600000); time_distance-=int_hour*3600000; //分 varint_minute=Math.floor(time_distance/60000); time_distance-=int_minute*60000; //秒 varint_second=Math.floor(time_distance/1000); //时分秒为单数时、前面加零 if(int_day0){ int_day="0"+int_day; }elseif(int_day

js简单的计时器开始和结束

2019-06-20 20:08:39 阅读：2338

这个主要是自己用来做记录的，字母太长背不下来，不喜勿喷，我也知道很简单，单纯的想记下来而已。js里面setInterval和setTimeout相同点和区别相同点：两个方法都是先触发间隔时间，再触发回调函数区别：1.setInterval每隔指定的时间就执行一次表达式，若不停止会一直执行下去而setTimeout在执行时,是在载入后延迟指定时间后,去执行一次表达式,次数仅为一次2.将setTimeout包含于被执行函数中,然后在函数外再次使用setTimeout来达到定时执行的目的这样,函数外的setTimeout在执行函数时再次触发setTimeout从而形成周而复始的定时效果，但是这样每次时间就相当于延迟时间+函数执行时间，时间越久，误差越大；而setInterval是间隔时间去执行函数，并不会产生误差，setInterval适用于显示时间，精确度高。/*自动调用三秒刷新一次*/ vardoreload=self.setInterval("reloadorder()",3000); functionreloadorder(){ window.location.href=window.location.href; } /*停止计时器的方法*/ $(function(){ $('.a').click(funtion(){ clearInterval(reloadorder); }); })也还可以这样（下面这两行应该好理解一下）：/*调用上面的方法*/ vardoreload=self.setInterval("reloadorder()",1500); /*清除上面的方法*/ clearInterval(doreload);两秒钟刷新一次页面：/*一分钟刷新一次本页面xuanfeng20190621*/ setTimeout(function(){ window.location.reload(); },2000);清除settimeout和setinterval的方法分别是：clearInterval(times);clearTimeout(buy_order);setinterval和settimeout设置方法分别如上面的例子

js定时器实现字体大小跳动效果

2019-06-16 20:52:21 阅读：2295

首先要先引入一个jQuery，因为我用的是jQuery，如果你喜欢只用js，也可以使用document.getElementByid也可以，殊途同归，反正我的主要目的是再说一下大家耳熟能详的js定时器。Js部分： varflag=0; functionjump_send(){ vartext=$('#jump_send'); if(!flag){ text.css('font-size','14px'); flag=1; }else{ text.css('font-size','12px'); flag=0; } setTimeout("jump_send()",500); } HTML部分： 我要发布请不要拍砖，虽然我知道很简单。。。。

使用layer来进行页面弹窗操作

2019-06-15 14:05:10 阅读：2192

效果如上图。接下来说一下怎么使用，首先，先去layer官网下载一个layer包，放到你的程序文件夹里，然后给需要使用弹窗的页面引入jquery和layer，然后就是把下面的方法引入页面中：functionwopen(uls,window_name){ layer.open({ type:2, title:window_name, btn:['关闭'], shadeClose:false, shade:0.8, area:['94%','94%'], closeBtn:0, content:uls, yes:function(index,layero){ window.location.reload(true); } }); }其中需要注意的是我设置的几个选项，上面代码中。如果你shadeclose和shade这些都不了解，那我没的说了，建议你先去官网看一下教程。然后是给使用的链接改一下，比如这个链接：你好那么改造之后应该是这样：你好最后，使用jquery监听一下edit_xf的点击事件，并获取id，重新组装url穿给刚才上面的js方法就行了。具体如下：$(function(){ $(".edit_xf").click(function(){ varid=$(this).attr('id'); varuls="http://www.baidu.com/index.html?id="+id; wopen(uls,'我是弹窗的标题名字'); }); });

正则表达式-常用

2019-06-15 11:16:48 阅读：2315

身份证号正则表达式（15位和18位身份证号都可以）：varreg=/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; if(reg.test(card)===false){ alert("身份证输入不合法"); returnfalse; }手机号正则表达式：varpattern=/^1[345789]\d{9}$/; if(!pattern.test(tel)){ layer.alert('手机号格式错误，请检查！',{icon:2,shade:0.8,title:"错误提示:"});returnfalse; }

全平台兼容---MP4视频播放器代码

2019-05-14 09:22:09 阅读：2162

包含手机端和电脑端，手机版包括：苹果端、安卓端（含微信内置浏览器和手机内置浏览器），全部可以使用此代码。用的就是html5的video标签，video里面的poster是视频播放前的视频预览图，不指定poster会显示为空或者视频第一个画面（视设备而定，建议设置poster），点击播放按钮后就会消失不见。相关视频从网上下载，如有侵权请联系我方下架，谢谢。PC版效果图:手机版效果图：相关代码： jQueryMP4视频播放器代码 $(function(){ //视频 jsModern.video("#video"); //播放视频 $(".VideoBtn").click(function(){ varvideo=document.getElementById("videoShow"); video.play(); $('.VideoBtn').hide(); }) //监听视频的播放状态 varvideo=document.getElementById("videoShow"); video.oncanplay=function(){ $(".VideoBtn").show(); //$("#video").attr("poster",""); } //视频播放事件 video.onplay=function(){ $("#videoShow").attr("poster",""); $(".VideoBtn").hide(); }; video.onplaying=function(){ $(".VideoBtn").hide(); }; //视频暂停事件 video.onpause=function(){ $(".VideoBtn").show(); }; //点击视频周围暂停播放图片出现 video.onclick=function(){ if(video.paused){ $(".VideoBtn").hide(); video.play(); }else{ $(".VideoBtn").show(); video.pause(); } }; }) 下载链接:https://pan.baidu.com/s/1dYoL4cOoV6GnuwhkgdmMeg提取码:kgec

兼容ios和安卓等移动设备的视频播放器代码

2019-05-13 15:29:28 阅读：2295

效果图如下：代码也很简单： HTML5手机网页视频播放器代码 当前浏览器不支持video直接播放，点击这里下载视频：下载视频 0:00:00 0:00:00 代码下载地址：链接:https://pan.baidu.com/s/1s5aXzqIyRa8GAuFtHN2pkw提取码:xeub

HTML5页面上通过百度地图显示当前内容

2019-04-20 17:39:11 阅读：2397

想使用此功能，您需要有一个百度账号，并申请指定域名下可用的ak，申请地址：lbsyun.baidu.com/apiconsole/key如下图：ak申请完毕之后，直接复制以下代码放入一个文件，并在创建的文件同级别目录中，放一个myicon.png，作为弹窗底部箭头的小图标，代码如下图： HTML5页面调用百度地图API，显示当前位置和内容 body,html,#allmap{width:100%;height:100%;overflow:hidden;margin:0;font-family:"微软雅黑";} varmap=newBMap.Map("allmap"); /*需要定位的位置坐标*/ varpoint=newBMap.Point(116.309983,40.012884); map.centerAndZoom(point,16); map.enableScrollWheelZoom(); /*下一行的myicon.png是坐标图片，和本文件同一个目录下*/ varmyIcon=newBMap.Icon("myicon.png",newBMap.Size(30,30),{ anchor:newBMap.Size(10,10) }); varmarker=newBMap.Marker(point,{icon:myIcon}); map.addOverlay(marker); vargeolocation=newBMap.Geolocation(); map.addOverlay(marker); varlicontent="圆明园遗址公园"; licontent+="地址：北京市海淀区清华西路28号"; licontent+="电话：(010)62543673"; varopts={ width:200, height:90, }; varinfoWindow=newBMap.InfoWindow(licontent,opts); marker.openInfoWindow(infoWindow); marker.addEventListener('click',function(){ marker.openInfoWindow(infoWindow); }); 最终效果如下图：

红包在整个页面四处飘动效果

2019-04-02 10:01:53 阅读：2345

话不多说，上效果图：下载地址：https://pan.baidu.com/s/1o7AQnk8hmjWoYQiS6bAl4g提取码:hiwv