给页面点击链接加了转圈圈和解决遇到的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学习笔记 4建立用户
一般用法 #useradd mysql 含义 创建 mysql用户 特殊用法 1> #useradd -d /usr/cjh -m cjh 含义:创建cjh用户 产生一个主目录 /usr/cj ...
- emoji
嗯...闲的... emoji:(博客园的markdown支持emoji编码...惊了) http://getemoji.com/ http://www.fhdq.net/emoji/emojifuh ...
- java 实验 三 (2)(3)
(2)编写一个Java程序,声明一个数组,各元素如:{12, 23, 456, 222, 768, 93245}计算出所有元素的和以及所有元素的平均值:SumArray.java(3)编写一个Java ...
- Java技能提升之路
James收集Java技能提升方面的资料,分为:基础篇.提高篇.高级篇… 给出“入口”,自我提升 1. Java工程师成神之路:http://www.hollischuang.com/archives ...
- 冲刺NOIP复习,算法知识点总结
前言 离NOIP还有一个星期,匆忙的把整理的算法补充完善,看着当时的整理觉得那时还年少.第二页贴了几张从贴吧里找来的图片,看着就很热血的.当年来学这个竞赛就是为了兴趣,感受计算机之美的. ...
- 安装完最小化 RHEL/CentOS 7 后需要做的 30 件事情7. 安装 PHP PHP 是用于 web 基础服务的服务器端脚本语言。它也经常被用作通用编程语言。在最小化安装的 CentOS 中安
CentOS 是一个工业标准的 Linux 发行版,是红帽企业版 Linux 的衍生版本.你安装完后马上就可以使用,但是为了更好地使用你的系统,你需要进行一些升级.安装新的软件包.配置特定服务和应用程 ...
- ACM知识点总结
1 枚举 2 模拟 3 构造 4 位运算的应用 5 查找 5.1 二分查找 5.2 分块查找 5.3 哈希查找HASH 5.3.1 线性探测法 5.3.2 字符串与哈希 6 搜索 6.1 深度优先搜索 ...
- [c++] opencv加载png
1.cvloadimage载入png文件时,默认的第2个参数是1,即CV_LOAD_IMAGE_COLOR,生成的iplimage对象的channel数是3,而不是4,丢失了第4通道.需要改为cvlo ...
- 关于git的使用记录总结
1.解决Windows下git换行符报警问题 git config --global core.autocrlf false 2.撤销add的文件退出暂存区 git reset --mixed 3.g ...
- phpstorm连接ftp
1.先到服务器中添加一个专门连接ftp的账号 useradd --help useradd -c sftp -d /data/project/testdir/ -g root -M sftp // 创 ...