给页面点击链接加了转圈圈和解决遇到的bug
今天遇到一个问题,之前给整个网站上的链接加了loading,今天遇到在ios的chrome和safari下点击进入新页面然后点击浏览器的返回按钮,loading还在,并且一直存在,最后网上搜到了解决方案特记录下
点击事件加loading:
$(document).on("click", "a[href!=''][href!='#'][href!='javascript:void(0)'][href!='javascript:void(0);'][href!='javascript:;']", function () {
var href = $(this).attr('href');
var target = $(this).attr('target');
var a_pageindex = $(this).data("pageindex");
if ($(this).hasClass('fancybox')) {
//弹出层的不loading
} else if (target != undefined && target == "_blank") {
//有_blank的不loading
} else if (href == undefined || href.indexOf("plus.google.com") > 0) {
//没有href的不loading 或者google分享不loading
} else if ($(this).data("pageindex") != undefined) {
//ajax 分页空间的分页按钮不需要
} else if (isCtrl) {
//如果按着ctrl键不执行
} else {
//href中以#开头的不loading
if (href.substring(0, 1) != '#' && href.indexOf("javascript:") == -1) {
LinkLoading(true);
}
}
});
解决ios的chrome和safari返回继续loading:
//瀏覽器回退頁面一直轉圈
if ($(window).width() < 1024) {
var detectBack = {
initialize: function () {
//监听hashchange事件
window.addEventListener('hashchange', function () {
//为当前导航页附加一个tag
this.history.replaceState('hasHash', '', ''); }, false); history.pushState(1, '', '')
window.onpopstate = function (e) {
if (!e.state) {
//fix chrome
window.history.back();
//侦测是用户触发的后退操作, dosomething
//这里刷新当前url
//window.location.reload();
}
};
}
}
detectBack.initialize();
//fix ios safair
window.onpageshow = function (event) {
if (event.persisted) {
window.location.reload()
}
};
}
最后经过试验,不管chrome还是safari这样就可以了
//瀏覽器回退頁面一直轉圈
if ($(window).width() < 1024) {
window.onpageshow = function (event) {
if (event.persisted) {
LinkLoading(false);
//下边的看情况添加
//location.reload();
}
};
}
定义和用法
onpageshow 事件在用户浏览网页时触发。
onpageshow 事件类似于 onload 事件,onload 事件在页面第一次加载时触发, onpageshow 事件在每次加载页面时触发,即 onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false
参考:https://code.ziqiangxuetang.com/jsref/event-onpageshow.html
给页面点击链接加了转圈圈和解决遇到的bug的更多相关文章
- //点击按钮加减音频音量到最小会出现bug什么意思???
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- iOS实现在webview页面内点击链接,跳转指定App
早上和UI刚谈到这个需求,然后自己试了一下,发现还是蛮简单的,记录一下: 思路分析: iOS内应用之间跳转都会用到 URL Schemes这个东西,简单的讲,这个就是用来定义app身份的一个id识别, ...
- ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 用javascript在客户端删除某一个cookie键值对 input点击链接另一个页面,各种操作。 C# 往线程里传参数的方法总结 TCP/IP 协议 用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图 (转)值得学习百度开源70+项目
ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 我们都知道在使用WebApi的时候Controller会自动将Action的返回值自动进行各种序列化处理(序列化为 ...
- hexo next主题中关于pc端点击链接没问题,移动端点击链接页面不显示。
个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 背景 hexo next主题,本人diy的时候 ...
- 让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边 点击链接后不跳转可以设置成
让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边 点击链接后不跳转可以设置成 1.<a href="javascri ...
- 用A标签实现页面内容定位 点击链接跳到具体位置
经常在维基百科等网站看到目录列表,点击链接会跳到具体的位置,小美眉一直在问是怎么做到的,其实挺简单的,用A标签实现页面内容定位就行了.实例参考微信营销理论手册的目录. 首先用A标签定义目录的链接. & ...
- js-禁止微信H5页面点击右上角菜单时出现“复制链接”,且分享仅支持微信分享
禁止微信H5页面点击右上角菜单时出现“复制链接”,这个问题已经影响到我很久很久了,起码有2年了, 昨天写H5活动的时候,需求有一个是:可分享,但是禁止复制活动链接, 这一下,就逼我务必好好研究研究了. ...
- 在Chrome浏览器中点击链接,打开IE浏览器,跳转到指定页面并传递参数
需求: 在Chrome浏览器中点击链接,打开IE浏览器,跳转到指定页面并传递参数 过程: 一些应用软件可以通过点击URL链接启动并执行操作(例如迅雷),这是如何做到的呢? 主要是通过修改注册表,注册U ...
- c# webbrowser 随机点击链接
HtmlElementCollection hec = webBrowser1.Document.All; ; i < hec.Count; i++) { if (hec[i].GetAttri ...
随机推荐
- linux相关操作命令
1.复制文件:cp -r file ./src 2.删除文件:rm -rf file 3.解压文件:tar -xvf bianque.tar.gz
- c/c++保存日志程序模板
//输出日志 int PrintRunInfo(char *fmt, ...) { FILE* fp; fp = fopen("cgi_log.txt","a+&qu ...
- UVA 1590 IP Networks JAVA
题意:输入m代表接下来的数据个数,计算接下来输入数据的网络掩码,和最小网络地址. 思路:①子网掩码:先将数据转为二进制,判断从哪一位开始有数据不一样,记下下标index,则子网掩码是index的前面是 ...
- SSM整合Activiti
1.pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns="h ...
- python基础一 ------顺序结构队列的python实现
队列:先进先出的线性表(FIFO),只允许在一段插入并在另一端取出 以下是python实现 #-*-coding:utf-8-*- #顺序存储队列的python实现 class Queue(objec ...
- sql面试题-----行转列
tem数据表如下图 select Time as 日期, sum ( case end ) as 胜, sum ( case end ) as 负 from tem group by Time 执行结 ...
- [COCI2013]DLAKAVAC
[COCI2013]DLAKAVAC 题目大意: 有一个长度为\(m(m\le1500)\)的\(01\)串\(A\),进行\(k(k\le10^{18})\)次操作.一次操作完的串中若\(A_i=1 ...
- lambda表达式 匿名函数
lambda函数是一种快速定义单行最小函数的方法,是从Lisp借鉴而来的,可以用在任何需要函数的地方. 基础 lambda语句中,冒号前是参数,可以有多个,用逗号分割:冒号右边是返回值. lambda ...
- java代码发送邮箱验证码与qq邮箱smtp服务
发送邮箱的类封装,在此之前需要一个jar包 javax.mail.jar 下载链接https://github.com/javaee/javamail/releases/download/JAVAM ...
- selenium 3+java 配置全
之前有配置过java+selenium的环境,感觉将的不够详细,这里重新写一篇,以便日后复习,和大家共享. 一.准备工作. 首先在配置之前需要准备以下: JDK Eclipse Sel ...