• 给页面点击链接加了转圈圈和解决遇到的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

  • 相关阅读:
    国内免费网络硬盘个人汇总
    SQL Server 2008 R2 (MS官方全版本),AIO,含x86和x64
    宣称支持REST的Web框架到底有多REST?
    flex(flash)下的pdf处理组件
    Visual Studio 2010 Pro Power Tools给VS2010的UI进行重大升级
    对XML里的属性或元素进行模糊搜索的方法
    Expression Blend 4 SP1现在可以支持Flash UI组件
    可选参数在.NET中全面开花
    Flex与JS交互完全攻略
    Flash Builder 4.0.1更新放出.同步更新框架为Flex SDK 4.1!支持最新的AIR 2正式版和Flash Player 10.1![图文]
  • 原文地址:https://www.cnblogs.com/0banana0/p/9844913.html
Copyright © 2020-2023  润新知