js修改url参数,无刷新更换页面url
一、js修改地址栏URL参数
function changeURLPar(destiny, par, par_value) {
var pattern = par + '=([^&]*)';
var replaceText = par + '=' + par_value;
if (destiny.match(pattern)) {
var tmp = '/\\' + par + '=[^&]*/';
tmp = destiny.replace(eval(tmp), replaceText);
return (tmp);
}
else {
if (destiny.match('[\?]')) {
return destiny + '&' + replaceText;
}
else {
return destiny + '?' + replaceText;
}
}
return destiny + '\n' + par + '\n' + par_value;
}
destiny是目标字符串,比如是http://www.huistd.com/?id=3&ttt=3
par是参数名,par_value是参数要更改的值,调用结果如下:
changeURLPar(test, 'id', 99); // http://www.huistd.com/?id=99&ttt=3
changeURLPar(test, 'haha', 33); // http://www.huistd.com/?id=99&ttt=3&haha=33
二、无刷新更换页面url
var url = document.URL, //获取当前页面的网址信息
URL;
var num = url.indexOf('#'); //获取#在的位置信息
if (num){
URL = url.substring(0,num); //截取网址信息
history.pushState(null,null,URL); //将网址设置
}
方法:window.history.pushState(state, title, url)
state
:一个与添加的记录相关联的状态对象,主要用于popstate
事件。该事件触发时,该对象会传入回调函数。也就是说,浏览器会将这个对象序列化以后保留在本地,重新载入这个页面的时候,可以拿到这个对象。如果不需要这个对象,此处可以填null
。title
:新页面的标题。但是,现在所有浏览器都忽视这个参数,所以这里可以填空字符串。url
:新的网址,必须与当前页面处在同一个域。浏览器的地址栏将显示这个网址。
js修改url参数,无刷新更换页面url的更多相关文章
- 使用ajax和history.pushState无刷新改变页面URL(转)
表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...
- 使用ajax和history.pushState无刷新改变页面URL
表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...
- 使用ajax和history.pushState无刷新改变页面URL onpopstate(转)
Javascript代码 var htmlData1 = $.ajax( { url: "/getXXXResponse", async: false }).re ...
- 使用pjax实现类似github无刷新更改页面url
pjax=pushState+ajax,相信用过github的同学都知道,github部分页面采用了pjax这个项目来实现ajax无刷新加载的同时改变页面url.一起来学习一下这个插件吧. 我们都知道 ...
- window.history.pushState与ajax实现无刷新更新页面url
ajax能无刷新更新数据,但是不能更新url HTML5的新API: window.history.pushState, window.history.replaceState 用户操作history ...
- 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL (转)
在访问现在很火的google plus时,细心的用户也许会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发生了了改变.并且能够很好的支持浏览器的前进和后退.不禁让人想问,是什么有这么强大 ...
- 使用ajax实现无刷新改变页面内容
如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...
- 使用ajax和js无刷新改变页面内容和地址栏URL
发现一个可以改变地址栏,而不导致页面刷新的东东. Chrome, FF测试通过,不支持IE. 实现目标 页面的跳转(前进后退,点击等)不重新请求页面 页面URL与页面展现内容一致(符合人们对传统网页的 ...
随机推荐
- linq 分组取各组最大值
static List<User> list1 = new List<User>() { new User(){id=1,name="张三"}, new U ...
- 01 自学Aruba之功率单位和相对单位
点击返回:自学Aruba之路 01 自学Aruba之功率单位和相对单位 功率单位是用来测量传输振幅和接受振幅的大小,功率单位测量的是绝对功率 相对单位是用来计算增加电缆或天线后的损耗和增益的大小,相对 ...
- 学习Spring Boot:(二十)使用 MongoDB
前言 MongoDB 1 是可以应用于各种规模的企业.各个行业以及各类应用程序的开源数据库.基于分布式文件存储的数据库.由C++语言编写.旨在为WEB应用提供可扩展的高性能数据存储解决方案.Mongo ...
- 【BZOJ4503】两个串(FFT)
[BZOJ4503]两个串(FFT) 题面 给定串\(S\),以及带通配符的串\(T\),询问\(T\)在\(S\)中出现了几次.并且输出对应的位置. \(|S|,|T|<=10^5\),字符集 ...
- rt-thread learning notes
rt-thread learning notes 2018-01-15 > 001 具有相同优先级的线程,每个线程的时间片大小都可以在初始化或创建该线程时指定 rt_thread_t rt_th ...
- Eclipse 插件Maven在使用 add dependency,找不到包,解决办法
通过右键单击pom.xml文件选择maven –> add dependency 或者是打开pom.xml文件,选择dependencies –>add 时,搜索不到依赖的jar包,解决方 ...
- 单片机I/O口的结构的详解
1.什么是源型 漏型?什么是上拉电阻?下拉电阻?什么是 线驱动输出 集电极开路输出,推挽式输出? 我们先来说说集电极开路输出的结构.集电极开路输出的结构如图1所示,右边的那个三极管集电极什么都不接,所 ...
- android sqlite批量插入数据速度解决方案
转自 http://hi.baidu.com/hfutonline/blog/item/62b1e4de8bdf4b2e5882dd28.html 最近在做android项目的时候遇到一个问题,应用程 ...
- 猜数字小游戏,很naive......
这里用到了随机数生成器以及ctime #include <cstdio> #include <cstdlib> #include <ctime> #include ...
- 右值引用&&
以下内容参考https://blog.csdn.net/china_jeffery/article/details/78520237 右值引用若不作为函数参数使用,基本等于滥用 右值引用 (Rvalu ...