100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > JS 修改地址栏URL参数 不跳转

JS 修改地址栏URL参数 不跳转

时间:2024-01-01 10:08:04

相关推荐

JS 修改地址栏URL参数 不跳转

使用History.replaceState()

replaceState()方法使用state objects,titleURL作为参数,修改当前历史记录实体,如果你想更新当前的 state 对象或者当前历史实体的URL来响应用户的的动作的话这个方法将会非常有用。

语法

history.replaceState(stateObj, title[, url]);

参数

stateObj

状态对象是一个 JavaScript 对象,它与传递给replaceState方法的历史记录实体相关联.

title

​​​​大部分浏览器忽略这个参数, 将来可能有用. 在此处传递空字符串应该可以防止将来对方法的更改。或者,您可以为该状态传递简短标题

url可选

历史记录实体的 URL. 新的 URL 跟当前的 URL 必须是同源; 否则 replaceState 抛出一个异常.

Javascript代码:

/*** changeURLStatic 修改地址栏 URL参数 不跳转* @param name* @param value*/function changeURLStatic(name, value) {let url = changeURLParam(location.href, name, value); // 修改 URL 参数history.replaceState(null, null, url); // 替换地址栏}/*** changeURLParam 修改 URL 参数* @param url* @param name* @param value* @returns {string}*/function changeURLParam(url, name, value) {if (typeof value === 'string') {value = value.toString().replace(/(^\s*)|(\s*$)/, ""); // 移除首尾空格}let url2;if (!value) { // removelet reg = eval('/(([\?|&])' + name + '=[^&]*)(&)?/i');let res = url.match(reg);if (res) {if (res[2] && res[2] === '?') { // before has ?if (res[3]) { // after has &url2 = url.replace(reg, '?');} else {url2 = url.replace(reg, '');}} else {url2 = url.replace(reg, '$3');}}} else {let reg = eval('/([\?|&]' + name + '=)[^&]*/i');if (url.match(reg)) { // editurl2 = url.replace(reg, '$1' + value);} else { // addlet reg = /([?](\w+=?)?)[^&]*/i;let res = url.match(reg);url2 = url;if (res) {if (res[0] !== '?') {url2 += '&';}} else {url2 += '?';}url2 += name + '=' + value;}}return url2;}

应用示例

参数存在示例:

//当前页面地址

index.php?m=p&a=index&classify_id=225&search=i

//执行修改

changeURLStatic('search', '99999');

//修改后页面地址

index.php?m=p&a=index&classify_id=225&search=99999

参数不存在示例:

//当前页面地址

index.php

//执行修改

changeURLStatic('m', 'Index');

//修改后页面地址

index.php?m=Index

//执行修改

changeURLStatic('search', '99999');

//修改后页面地址

index.php?m=Index&search=99999

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。