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. 搞懂分布式技术2:分布式一致性协议与Paxos,Raft算法

    搞懂分布式技术2:分布式一致性协议与Paxos,Raft算法 2PC 由于BASE理论需要在一致性和可用性方面做出权衡,因此涌现了很多关于一致性的算法和协议.其中比较著名的有二阶提交协议(2 Phas ...

  2. 二十九 Python分布式爬虫打造搜索引擎Scrapy精讲—selenium模块是一个python操作浏览器软件的一个模块,可以实现js动态网页请求

    selenium模块 selenium模块为第三方模块需要安装,selenium模块是一个操作各种浏览器对应软件的api接口模块 selenium模块是一个操作各种浏览器对应软件的api接口模块,所以 ...

  3. nyoj1007——欧拉求和

    GCD 时间限制:1000 ms  |  内存限制:65535 KB 难度:3   描述 The greatest common divisor GCD(a,b) of two positive in ...

  4. Spring3.0 核心jar包详解

    org.springframework.aop  包含在应用中使用Spring的AOP特性时所需的类. org.springframework.asm   Spring独立的ASM程序, Spring ...

  5. Qt5全局热键-QxtGlobalShortcut

    最近做一个项目需要注册全局热键,在网上搜索发现有个第三方库 libqxt 中给出一个比较好的跨平台的解决方案,就是 QxtGlobalShortcut. 但是编译过程中发现这个库用到的QAbstrac ...

  6. 进程上下文频繁切换导致load average过高

    一.问题现象 现网有两台虚拟机主机95%的cpu处于idle状态,内存使用率也不是特别高,而主机的load average达到了40多. 二.问题分析 先在主机上通过top.free.ps.iosta ...

  7. Linux 磁盘管理,Linux vi/vim

    一.Linux 磁盘管理 Linux磁盘管理好坏直接关系到整个系统的性能问题. Linux磁盘管理常用三个命令为df.du和fdisk. df:列出文件系统的整体磁盘使用量 du:检查磁盘空间使用量 ...

  8. Friendly Date Ranges

    让日期区间更友好! 把常见的日期格式如:YYYY-MM-DD 转换成一种更易读的格式. 易读格式应该是用月份名称代替月份数字,用序数词代替数字来表示天 (1st 代替 1). 记住不要显示那些可以被推 ...

  9. css3之calc()

    初识calc() 在使用calc()之前,我也只是听说有这么一个东西,但在用过之后我才发现这个功能其实很实用. calc()其实就是英文calculate(计算)的缩写,它看起来像个函数吧? 其实不是 ...

  10. [C#]委托实例分析(附源码)

    一直都听说C#中的委托与事件非常重要,都没有什么切身的体会,而这次通过做一个WinForm二次开发的项目才真正感觉到了委托与事件的犀利之处. 1.C#中的事件和委托的作用? 事件代表一个组件能够被关注 ...