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(); // 返回构造

});
原文地址:https://www.cnblogs.com/snmic/p/10400421.html