FastAdmin 无刷新地址改变

群里有人问 FastAdmin 是不是用了 pjax?

之前有看到 Karson 回复过,其实 FastAdmin 用的是 HTML5 的一个History API pushState

那代码在哪里呢?

require-backend.min.js

        if (history.pushState) {
//浏览器前进后退事件
$(window).on("popstate", function (e) {
var state = e.originalEvent.state;
if (state) {
$("a[addtabs=" + state.id + "]", options.monitor).data("pushstate", true).trigger("click");
}
});
}
$(options.monitor).on('click', '[addtabs]', function (e) {
if ($(this).attr('url').indexOf("javascript:") !== 0) {
if ($(this).is("a")) {
e.preventDefault();
}
var id = $(this).attr('addtabs');
var title = $(this).attr('title') ? $(this).attr('title') : $.trim($(this).text());
var url = $(this).attr('url');
var content = options.content ? options.content : $(this).attr('content');
var ajax = $(this).attr('ajax') === '1' || $(this).attr('ajax') === 'true';
var state = ({
url: url, title: title, id: id, content: content, ajax: ajax
}); document.title = title;
if (history.pushState && !$(this).data("pushstate")) {
var pushurl = url.indexOf("ref=addtabs") === -1 ? (url + (url.indexOf("?") > -1 ? "&" : "?") + "ref=addtabs") : url;
try {
window.history.pushState(state, title, pushurl);
} catch (e) { }
}
$(this).data("pushstate", null);
_add.call(this, {
id: id,
title: $(this).attr('title') ? $(this).attr('title') : $(this).html(),
content: content,
url: url,
ajax: ajax
});
}
});

我们始终相信,完美的也是脆弱的,不要一味的追求完美却忘了最初的目标。

FastAdmin 无刷新地址改变的更多相关文章

  1. JSF中使用f:ajax标签无刷新页面改变数据

    ajax本是用在前端的一种异步请求数据的操作,广泛用于js中,一般的js框架如jq都有被封装好的方法,用于发起异步请求操作.异步操作可以增强用户体验和操作,越来越多的程序都在使用ajax.JSF的fa ...

  2. history.js 一个无刷新就可改变浏览器栏地址的插件(不依赖jquery)

    示例: http://browserstate.github.io/history.js/demo/     简介   HTML4有一些对浏览历史的前进后退API的支持如:   window.hist ...

  3. 使用ajax实现无刷新改变页面内容

    如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...

  4. 使用ajax和history.pushState无刷新改变页面URL

    表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...

  5. 通过history.pushState无刷新改变url

    通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...

  6. 使用ajax和history.pushState无刷新改变页面URL onpopstate(转)

    Javascript代码 var htmlData1 = $.ajax(    {    url: "/getXXXResponse",    async: false }).re ...

  7. 使用ajax和history.pushState无刷新改变页面URL(转)

    表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...

  8. history.pushState无刷新改变url

    通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...

  9. 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

随机推荐

  1. 不小心把sudoer改错了的补救方法

    原本是感觉每次 sudo command 都要输入密码太费事了,就想把密码去掉.好了怎么去掉呢,自然是修改 /etc/sudoers 可是不小心修改错了,结果悲剧出现了:由于是在非root用户模式下, ...

  2. hihocoder1457

    http://hihocoder.com/problemset/problem/1457 找不重复子串的和 topo序搞一搞,用父亲更新儿子节点的val,记得乘上节点数 //#pragma comme ...

  3. 搞懂分布式技术12:分布式ID生成方案

    搞懂分布式技术12:分布式ID生成方案 ## 转自: 58沈剑 架构师之路 2017-06-25 一.需求缘起 几乎所有的业务系统,都有生成一个唯一记录标识的需求,例如: 消息标识:message-i ...

  4. 1-24-case流程控制和while循环语句的使用

    大纲: 1.while循环控制语句 while实战---批量添加规则用户 while实战---猜价格游戏 2.case流程控制语句和exit退出 exit实战---返回值测试 case实战---智能解 ...

  5. C#/JAVA 程序员转GO/GOLANG程序员笔记大全(DAY 00)

    一.安装说明 https://studygolang.com/dl 二.环境变量 // 下载 *.msi 安装文件,部分环境变量默认配置好了. 其他配置如下描述 三.目录及项目层级关系 在系统环境变量 ...

  6. HDU 4696 Answers (脑补+数形结合)

    题意 给一个图,每个点的出度为1,每个点的权值为1或者2.给Q个询问,问是否能找到一条路径的权值和M. 思路 由于每个点的出度为1,所以必然存在环.又因为c[i]只能取1或者2,可以组成任意值,所以只 ...

  7. 卸载Linux自带的JDK

    Redhat Enterprise Linux中自带了jdk的旧版本,往往需要卸载,卸载步骤如下: 在终端输入:yum remove java 终端显示:Is this ok[y/N]: 输入y,按回 ...

  8. poj2771

    题解: 二分图最大独立及 每两个不能选的渐变 输出n+m-最大匹配 代码: #include<cstdio> #include<cmath> #include<algor ...

  9. iRSF快速简单易用的实现列表、排序、过滤功能

    IRSF 是由javascript编写,iRSF快速简单易用的实现列表.排序.过滤功能(该三种操作以下简称为 RSF ). iRSF由三个类组成. iRSFSource 数据源 iRSFFilter ...

  10. 通过ping 主机名,或者主机名对应的IP地址

    通过ping 主机名,或者主机名对应的IP地址: 如下图: 懵了吧? 但是你用 ping 主机名 -4