首页 > 语言 > JavaScript > 正文

分享javascript、jquery实用代码段

2024-05-06 15:08:09
字体:
来源:转载
供稿:网友

本文实例为大家简单分享javascript、jquery实用demo,供大家参考,具体内容如下

javascript判断H5页面离开

function onbeforeunloadFn(){ console.log('离开页面'); //...code}function showOnbeforeunload(flags){ if(flags){ document.body.onbeforeunload = onbeforeunloadFn; }else{ document.body.onbeforeunload = null; }}$(function(){ showOnbeforeunload(true);})

jq判断img标签图片地址是否已经加载完毕

imgStatus = 0; $("img").each(function(){ if(this.complete){/*this.complete代表图片加载完成*/  imgStatus++; } });

iframe获取内容-和设置

if($(".ad_show iframe").size() > 0 ){ $(".ad_show iframe").attr("id","iframead");/*设置iframe的id*/ /*获取id为iframead的iframe的dom对象*/ var iframebox = document.getElementById("iframead").contentWindow; /*设置兜底内容*/ iframebox.document.body.innerText = "1234";}

javascript获取浏览器上一页的url

 /*返回上一次url,如果是新窗口则不能获取到*/var beforeUrl = document.referrer;

关于头疼的移动端点击冒泡事件

<script>$(".class").live('tap',function(oEvent){ e = window.event || oEvent; if(e.stopPropagation){ e.stopPropagation(); }else{ e.cancelBubble = true; } e.preventDefault();});</script>/*虽说tap事件可以阻止大部分冒泡事件,但是还是有一小部分移动端不吃你这套,那么有另外一个解决办法*//*将层级间的事件通过H5属性data-flag="true"来控制*/<!--html--><div class="parentTap" data-flag="true"> <div class="childTap" data-flag="false"> <div class="childsTap" data-flag="false">  .... </div> </div></div><!--给父级parentTap绑定一个点击事件--><!--给子级childTap绑定一个点击事件--><!--给子孙级childsTap绑定一个点击事件--><script type="text/javascript"> var bindInit = function(className){ if($(className).size() > 0){  $(className).on('tap',function(oEvent){  e = window.event || oEvent;if(e.stopPropagation){e.stopPropagation();}else{e.cancelBubble = true;}e.preventDefault();  var flag = $(this).data('flag');  if(flag){/*为true时允许点击进入事件*/   /* code... */  }  }); } } $(function(){ bindInit('.parentTap'); bindInit('.childTap'); bindInit('.childsTap'); });</script>

简单倒计时功能

<div class="newTime" data-end="2016-10-13 23:59:59" data-now="2016-10-13 03:59:59"> <div class="t_d"></div> <div class="t_h"></div> <div class="t_m"></div> <div class="t_s"></div></div> <script type="text/javascript"> /*倒计时*/ var timeDown = {  GetRTime: function (timeId,oldNowTime) {  var tempTime;/*保存上一次时间*/  if(oldNowTime){   tempTime = new Date(oldNowTime.getTime() + 1000);/*如果有上一次时间则赋值*/   /*console.log(tempTime);*/  }  var EndTime = new Date($("#" + timeId).data("end"));/*获取结束时间*/  if (!tempTime) {   if ($("#" + timeId).data("now") == "" || $("#" + timeId).data("now") == "null") {   var NowTime = new Date();   } else {   var NowTime = new Date($("#" + timeId).data("now"));/*取开始时间*/   }  } else {   var NowTime = tempTime;  }  if (EndTime.getTime() >= NowTime.getTime()) {/*判断时间*/   var t = EndTime.getTime() - NowTime.getTime();/*得到结束时间减去开始时间的时间戳*/   var d = Math.floor(t / 1000 / 60 / 60 / 24);/*日*/   var h = Math.floor(t / 1000 / 60 / 60 % 24);/*时*/   var m = Math.floor(t / 1000 / 60 % 60);/*分*/   var s = Math.floor(t / 1000 % 60);/*秒*/   /*将时间填入对应的html中*/   $(".t_d", "#" + timeId).html((d > 9 ? '' : '0') + d);   $(".t_h", "#" + timeId).html((h > 9 ? '' : '0') + h);   $(".t_m", "#" + timeId).html((m > 9 ? '' : '0') + m);   $(".t_s", "#" + timeId).html((s > 9 ? '' : '0') + s);   tempTime = new Date(NowTime.getTime() + 1000);/*将开始时间+1秒*/   setTimeout(function () {   timeDown.GetRTime(timeId,NowTime);/*等待一秒后继续执行*/   }, 1000);  } else if (EndTime.getTime() == NowTime.getTime()) {/*当时间相等时要做处理的code*/   $("#"+timeId).hide();  }  } } var t=0; if ($(".newTime").size() > 0) {  $(".newTime").each(function(){  var timeId="timeOut"+t;  $(this).attr("id",timeId);/*设置多个倒计时时指定唯一id*/  t++;  timeDown.GetRTime(timeId,null);/*开始调用*/  }); } </script>            
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选