ajax hash调用实例

$('[com-view]').on('click', function (e) {
        // render($(this).data('view'));
        // hashRoute.render($(this).data('view'));
        view.render($(this).data('view'));
    })

    // 路由
    var HashRoute = function HashRoute(params) {
        var _self = this;
        this.init = function () {
            window.addEventListener('DOMContentLoaded', function () {
                console.log('DOMContentLoaded');
            })
            $(document).ready(_self.setRoute);
            // 1.直接更改浏览器地址,在最后面增加或改变#hash; 
            // 2.通过改变location.href 或 location.hash的值; 
            // 3.通过触发点击带锚点的链接; 
            // 4.浏览器前进后退可能导致hash的变化,前提是两个网页地址中的hash值不同
            window.addEventListener('hashchange', _self.setRoute)
        }

        this.setRoute = function () {
            var route = layui.router();
            // layer.msg('只想弱弱提示<br>' + location.href);
            // console.log(route.href);
            if(route.href != undefined) {
                route.href = route.href.substr(route.href.length - 1, 1) == '/' ? route.href + setter.entry : route.href;
            }

            ajaxModel.ajaxMethod({
                url: setter.views + (route.href ? route.href : setter.entry) + setter.engine,
                dataType: 'html',
                successfn: function (e) {
                    $('.layadmin-tabsbody-item.layui-show').html(e);
                },
                errorfn: function (e) {
                    // e.status === 404 ? _self.render('tips/404') : _self.render('tips/error');
                }
            })
        }

        this.skip = function (path) {
            location.hash = '#/${path}'
        }

        this.render = function (u) {
            location.hash = _self.correctRouter(u);
        }

        this.correctRouter = function (e) {
            return /^\//.test(e) || (e = "/" + e),
                e.replace(/^(\/+)/, "/").replace(new RegExp("/" + setter.entry + "$"), "/");
        }

    };
    // const hashRoute = new HashRoute()
    // hashRoute.init();

参考

// 该写法为了满足多条件下的 CommonJs,Node.js, window,layui

(function (name, factory) {
    // 检测上下文是否为AMD或者CMD
    var hasDefine = typeof define === "function",
        // 检查上下文环境是否为Node
        hasExports = typeof module !== 'undefined' && module.exports,
        hasLayui = this.layui && layui.define;

    if (hasDefine) {
        // AMD 环境或者 CMD环境
        define(factory);
    } else if (hasExports) {
        // 定义为普通的Node模块
        module.exports = factory();
    } else if (hasLayui) {
        layui.define(['jquery', 'ajaxModel', 'setter'], function (exports) {
            exports('view', factory());
        });
    } else {
        // window对象
        this[name] = factory();
    }
}

)('view', function () {
    "use strict";
    var $ = layui.jquery,
        setter = layui.setter,
        ajaxModel = layui.ajaxModel;

    var _self = null;
    var View = function View(params) {
        _self = this;
    };

    View.prototype.init = function () {
        window.addEventListener('DOMContentLoaded', function () {
            console.log('DOMContentLoaded');
        })
        $(document).ready(_self.setRoute);
        // 1.直接更改浏览器地址,在最后面增加或改变#hash; 
        // 2.通过改变location.href 或 location.hash的值; 
        // 3.通过触发点击带锚点的链接; 
        // 4.浏览器前进后退可能导致hash的变化,前提是两个网页地址中的hash值不同
        window.addEventListener('hashchange', _self.setRoute)
    }

    View.prototype.setRoute = function () {
        var route = layui.router();
        // layer.msg('只想弱弱提示<br>' + location.href);
        // console.log(route.href);
        if (route.href != undefined) {
            route.href = route.href.substr(route.href.length - 1, 1) == '/' ? route.href + setter.entry : route.href;
        }

        ajaxModel.ajaxMethod({
            url: setter.views + (route.href ? route.href : setter.entry) + setter.engine,
            dataType: 'html',
            successfn: function (e) {
                $('.layadmin-tabsbody-item.layui-show').html(e);
            },
            errorfn: function (e) {
                // e.status === 404 ? _self.render('tips/404') : _self.render('tips/error');
            }
        })
    }

    View.prototype.skip = function (path) {
        location.hash = '#/${path}'
    }
    View.prototype.render = function (u) {
        location.hash = _self.correctRouter(u);
    }

    View.prototype.correctRouter = function (e) {
        return /^\//.test(e) || (e = "/" + e),
            e.replace(/^(\/+)/, "/").replace(new RegExp("/" + setter.entry + "$"), "/");
    }


    return new View(); // 返回构造

});

猜你喜欢

转载自www.cnblogs.com/snmic/p/10400421.html
今日推荐