今天遇到一个问题,之前给整个网站上的链接加了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的更多相关文章

  1. //点击按钮加减音频音量到最小会出现bug什么意思???

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. iOS实现在webview页面内点击链接,跳转指定App

    早上和UI刚谈到这个需求,然后自己试了一下,发现还是蛮简单的,记录一下: 思路分析: iOS内应用之间跳转都会用到 URL Schemes这个东西,简单的讲,这个就是用来定义app身份的一个id识别, ...

  3. 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的返回值自动进行各种序列化处理(序列化为 ...

  4. hexo next主题中关于pc端点击链接没问题,移动端点击链接页面不显示。

    个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 背景 hexo next主题,本人diy的时候 ...

  5. 让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边 点击链接后不跳转可以设置成

    让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边     点击链接后不跳转可以设置成     1.<a href="javascri ...

  6. 用A标签实现页面内容定位 点击链接跳到具体位置

    经常在维基百科等网站看到目录列表,点击链接会跳到具体的位置,小美眉一直在问是怎么做到的,其实挺简单的,用A标签实现页面内容定位就行了.实例参考微信营销理论手册的目录. 首先用A标签定义目录的链接. & ...

  7. js-禁止微信H5页面点击右上角菜单时出现“复制链接”,且分享仅支持微信分享

    禁止微信H5页面点击右上角菜单时出现“复制链接”,这个问题已经影响到我很久很久了,起码有2年了, 昨天写H5活动的时候,需求有一个是:可分享,但是禁止复制活动链接, 这一下,就逼我务必好好研究研究了. ...

  8. 在Chrome浏览器中点击链接,打开IE浏览器,跳转到指定页面并传递参数

    需求: 在Chrome浏览器中点击链接,打开IE浏览器,跳转到指定页面并传递参数 过程: 一些应用软件可以通过点击URL链接启动并执行操作(例如迅雷),这是如何做到的呢? 主要是通过修改注册表,注册U ...

  9. c# webbrowser 随机点击链接

    HtmlElementCollection hec = webBrowser1.Document.All; ; i < hec.Count; i++) { if (hec[i].GetAttri ...

随机推荐

  1. 从香港机房引入google/bitbucket路由

    首先说这种方法有一个局限性:只适用于非CDN网段的引入,比如Google自己足够大,所以用不到CDN,那在香港解析出来的就是Google在香港自己的AS number,因此不存在CDN干扰的问题.如果 ...

  2. Stanford CoreNLP使用需要注意的一点

    1.Stanford CoreNLP maven依赖,jdk依赖1.8 <dependency> <groupId>edu.stanford.nlp</groupId&g ...

  3. 事务(transaction )

    事务(Transaction)是访问并可能更新数据库中各种数据项的一个程序执行单元(unit). 事务是恢复和并发控制的基本单位. 事务有4个特性:原子性.一致性.隔离性.持久性.(即ACID) 原子 ...

  4. Shell脚本笔记(六)呈现数据

    呈现数据 一.文件描述符 Linux系统将每个对象当做文件处理,这包括输入和输出进程.Linux用文件描述符来标识每个文件对象.每个进程最多可以有9个 文件描述符,bash shell保留了前三个文件 ...

  5. BZOJ3537 : [Usaco2014 Open]Code Breaking

    考虑容斥,枚举哪些串必然出现,那么贡献为$(-1)^{选中的串数}$. 设$f[i][j]$表示$i$的子树内,$i$点往上是$j$这个串的贡献之和,那么总状态数为$O(n+m)$,用map存储$f$ ...

  6. ab测试工具

    我们可以模拟100个并发用户,对一个页面发送1000个请求 输入命令:ab -n1000 -c100 http://www.jb51.net/ 结果: ##首先是apache的版本信息 This is ...

  7. Mybatis JDBC->Mybatis

    1 什么是JDBC Java程序都是通过JDBC(Java Data Base Connectivity)连接数据库的,通过SQL对数据库编程.JDBC是由SUN公司(SUN公司已被Oracle公司收 ...

  8. vs 基本验证控件使用

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.c ...

  9. Docker 常用命令(四)

    1. 查看容器中的进程信息: docker top 772d23 查看容器的详细信息: docker inspect 772d23 持续更新日志 docker logs -f 7732dx

  10. Tornado-cookie

    cookie 服务端在客户端的中写一个字符串,下一次客户端再访问时只要携带该字符串,就认为其是合法用户. tornado中的cookie有两种,一种是未加密的,一种是加密的,并且可以配置生效域名.路径 ...