我有这个URL:
site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc
我需要的是能够改变'行' url参数值我指定的东西,让我们说10。如果“行”不存在,我需要将它添加到url的末尾,并添加我已经指定的值(10)。
我有这个URL:
site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc
我需要的是能够改变'行' url参数值我指定的东西,让我们说10。如果“行”不存在,我需要将它添加到url的末尾,并添加我已经指定的值(10)。
当前回答
快速的纯js小解决方案,不需要插件:
function replaceQueryParam(param, newval, search) {
var regex = new RegExp("([?;&])" + param + "[^&;]*[;&]?");
var query = search.replace(regex, "$1").replace(/&$/, '');
return (query.length > 2 ? query + "&" : "?") + (newval ? param + "=" + newval : '');
}
这样叫它:
window.location = '/mypage' + replaceQueryParam('rows', 55, window.location.search)
或者,如果你想保持在同一页上并替换多个参数:
var str = window.location.search
str = replaceQueryParam('rows', 55, str)
str = replaceQueryParam('cols', 'no', str)
window.location = window.location.pathname + str
Luke:要完全删除参数,为值传递false或null: replaceQueryParam('rows', false, params)。因为0也是假的,所以指定'0'。
其他回答
这是对苏乔伊回答的另一种说法。刚刚改变了变量名,并添加了一个命名空间包装:
window.MyNamespace = window.MyNamespace || {};
window.MyNamespace.Uri = window.MyNamespace.Uri || {};
(function (ns) {
ns.SetQueryStringParameter = function(url, parameterName, parameterValue) {
var otherQueryStringParameters = "";
var urlParts = url.split("?");
var baseUrl = urlParts[0];
var queryString = urlParts[1];
var itemSeparator = "";
if (queryString) {
var queryStringParts = queryString.split("&");
for (var i = 0; i < queryStringParts.length; i++){
if(queryStringParts[i].split('=')[0] != parameterName){
otherQueryStringParameters += itemSeparator + queryStringParts[i];
itemSeparator = "&";
}
}
}
var newQueryStringParameter = itemSeparator + parameterName + "=" + parameterValue;
return baseUrl + "?" + otherQueryStringParameters + newQueryStringParameter;
};
})(window.MyNamespace.Uri);
现在的用法是:
var changedUrl = MyNamespace.Uri.SetQueryStringParameter(originalUrl, "CarType", "Ford");
你也可以通过普通的JS来实现
var url = document.URL
var newAdditionalURL = "";
var tempArray = url.split("?");
var baseURL = tempArray[0];
var aditionalURL = tempArray[1];
var temp = "";
if(aditionalURL)
{
var tempArray = aditionalURL.split("&");
for ( var i in tempArray ){
if(tempArray[i].indexOf("rows") == -1){
newAdditionalURL += temp+tempArray[i];
temp = "&";
}
}
}
var rows_txt = temp+"rows=10";
var finalURL = baseURL+"?"+newAdditionalURL+rows_txt;
您可以使用我的这个库来完成这项工作:https://github.com/Mikhus/jsurl
var url = new Url('site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc');
url.query.rows = 10;
alert( url);
想想这个例子:
const myUrl = new URL("http://www.example.com?columns=5&rows=20");
myUrl.searchParams.set('rows', 10);
console.log(myUrl.href); // http://www.example.com?columns=5&rows=10
myUrl.searchParams.set('foo', 'bar'); // add new param
console.log(myUrl.href); // http://www.example.com?columns=5&rows=10&foo=bar
它会做和你要求的完全一样的事情。请注意URL必须有正确的格式。在你的例子中,你必须指定协议(http或https)
我只是写了一个简单的模块来处理读取和更新当前url查询参数。
使用示例:
import UrlParams from './UrlParams'
UrlParams.remove('foo') //removes all occurences of foo=?
UrlParams.set('foo', 'bar') //set all occurences of foo equal to bar
UrlParams.add('foo', 'bar2') //add bar2 to foo result: foo=bar&foo=bar2
UrlParams.get('foo') //returns bar
UrlParams.get('foo', true) //returns [bar, bar2]
下面是我的代码UrlParams.(js/ts):
class UrlParams {
/**
* Get params from current url
*
* @returns URLSearchParams
*/
static getParams(){
let url = new URL(window.location.href)
return new URLSearchParams(url.search.slice(1))
}
/**
* Update current url with params
*
* @param params URLSearchParams
*/
static update(params){
if(`${params}`){
window.history.replaceState({}, '', `${location.pathname}?${params}`)
} else {
window.history.replaceState({}, '', `${location.pathname}`)
}
}
/**
* Remove key from url query
*
* @param param string
*/
static remove(param){
let params = this.getParams()
if(params.has(param)){
params.delete(param)
this.update(params)
}
}
/**
* Add key value pair to current url
*
* @param key string
* @param value string
*/
static add(key, value){
let params = this.getParams()
params.append(key, value)
this.update(params)
}
/**
* Get value or values of key
*
* @param param string
* @param all string | string[]
*/
static get(param, all=false){
let params = this.getParams()
if(all){
return params.getAll(param)
}
return params.get(param)
}
/**
* Set value of query param
*
* @param key string
* @param value string
*/
static set(key, value){
let params = this.getParams()
params.set(key, value)
this.update(params)
}
}
export default UrlParams
export { UrlParams }