zoukankan      html  css  js  c++  java
  • 给页面点击链接加了转圈圈和解决遇到的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

  • 相关阅读:
    centos7.6 使用yum安装mysql5.7
    解决hadoop本地库问题
    docker-compose 启动警告
    docker 安装zabbix5.0 界面乱码问题解决
    docker 部署zabbix问题
    zookeeper 超时问题
    hbase regionserver异常宕机
    (转载)hadoop 滚动升级
    hadoop Requested data length 86483783 is longer than maximum configured RPC length
    zkfc 异常退出问题,报错Received stat error from Zookeeper. code:CONNECTIONLOSS
  • 原文地址:https://www.cnblogs.com/0banana0/p/9844913.html
Copyright © 2011-2022 走看看