Как заменить параметр url на javascript/jquery?
Я искал эффективный способ сделать это, но не смог его найти, в основном то, что мне нужно, это то, что с учетом этого URL-адреса, например:
http://localhost/mysite/includes/phpThumb.php?src=http://media2.jupix.co.uk/v3/clients/4/properties/795/IMG_795_1_large.jpg&w=592&aoe=1&q=100
Я хотел бы изменить URL-адрес в параметре src
с другим значением с помощью javascript или jquery, возможно ли это?
Спасибо заранее.
Ответы
Ответ 1
Разве это не было бы лучшим решением?
var text = 'http://localhost/mysite/includes/phpThumb.php?src=http://media2.jupix.co.uk/v3/clients/4/properties/795/IMG_795_1_large.jpg&w=592&aoe=1&q=100';
var newSrc = 'www.google.com';
var newText = text.replace(/(src=).*?(&)/,'$1' + newSrc + '$2');
РЕДАКТИРОВАТЬ:
добавил ясности в код и сохранил src в полученной ссылке
$1
представляет первую часть в ()
(то есть) src=
а $2
представляет вторую часть в ()
(т.е.) &
, так что это означает, что вы собираетесь изменить значение между src
и &
. Более понятно, это должно быть так:
src='changed value'& // this is to be replaced with your original url
ДОБАВИТЬ для замены всех вхождений:
Если у вас есть несколько параметров с одним и тем же именем, вы можете добавить к глобальному флагу регулярного выражения, например, этот text.replace(/(src=).*?(&)/g,'$1' + newSrc + '$2');
и это будет заменять все значения для тех параметров, которые имеют то же имя.
Ответ 2
Следующее решение объединяет другие ответы и обрабатывает некоторые особые случаи:
- Параметр не существует в исходном URL-адресе
- Параметр является единственным параметром
- Параметр является первым или последним
- Новое значение параметра такое же, как у старого
- URL заканчивается символом
?
персонаж -
\b
гарантирует, что другой параметр, заканчивающийся paramName, не будет сопоставлен
Решение:
function replaceUrlParam(url, paramName, paramValue)
{
if (paramValue == null) {
paramValue = '';
}
var pattern = new RegExp('\\b('+paramName+'=).*?(&|#|$)');
if (url.search(pattern)>=0) {
return url.replace(pattern,'$1' + paramValue + '$2');
}
url = url.replace(/[?#]$/,'');
return url + (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue;
}
Известные ограничения:
- Не очищает параметр, устанавливая paramValue равным null, вместо этого он устанавливает его в пустую строку. См. fooobar.com/questions/65146/... если вы хотите удалить параметр.
Ответ 3
Javascript теперь дает очень полезную функцию для обработки параметров URL: URLSearchParams
var searchParams = new URLSearchParams(window.location.search);
searchParams.set('src','newSrc')
var newParams = searchParams.toString()
Ответ 4
В наши дни это возможно с родным JS
var href = new URL('https://google.com?q=cats');
href.searchParams.set('q', 'dogs');
console.log(href.toString()); // https://google.com/?q=dogs
Ответ 5
Здесь изменен код stenix, он не идеален, но он обрабатывает случаи, когда в url присутствует параметр, содержащий содержащийся параметр, например:
/search?searchquery=text and 'query' is provided.
В этом случае изменяется значение параметра searchquery.
код:
function replaceUrlParam(url, paramName, paramValue){
var pattern = new RegExp('(\\?|\\&)('+paramName+'=).*?(&|$)')
var newUrl=url
if(url.search(pattern)>=0){
newUrl = url.replace(pattern,'$1$2' + paramValue + '$3');
}
else{
newUrl = newUrl + (newUrl.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue
}
return newUrl
}
Ответ 6
UpdatE: сделайте для вас приятной функцией: http://jsfiddle.net/wesbos/KH25r/1/
function swapOutSource(url, newSource) {
params = url.split('&');
var src = params[0].split('=');
params.shift();
src[1] = newSource;
var newUrl = ( src.join('=') + params.join('&'));
return newUrl;
}
Затем перейдите к нему!
var newUrl = swapOutSource("http://localhost/mysite/includes/phpThumb.php?src=http://media2.jupix.co.uk/v3/clients/4/properties/795/IMG_795_1_large.jpg&w=592&aoe=1&q=100","http://link/to/new.jpg");
console.log(newUrl);
Ответ 7
Если вы посмотрите внимательно, вы увидите две неожиданные вещи о URL-адресах: (1) они кажутся простыми, но детали и угловые случаи на самом деле сложны, (2) Удивительно, что JavaScript не предоставляет полный API для работы с их легче. Я думаю, что полноценная библиотека предназначена для того, чтобы люди не изобретали колесо самостоятельно или не копировали какой-нибудь случайный чувак умный, но, вероятно, фрагмент кода кода регулярного выражения. Возможно, попробуйте URI.js(http://medialize.github.io/URI.js/)
Ответ 8
Как насчет чего-то вроде этого:
<script>
function changeQueryVariable(keyString, replaceString) {
var query = window.location.search.substring(1);
var vars = query.split("&");
var replaced = false;
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == keyString) {
vars[i] = pair[0] + "="+ replaceString;
replaced = true;
}
}
if (!replaced) vars.push(keyString + "=" + replaceString);
return vars.join("&");
}
</script>
Ответ 9
В дополнение к @stenix это отлично сработало для меня
url = window.location.href;
paramName = 'myparam';
paramValue = $(this).val();
var pattern = new RegExp('('+paramName+'=).*?(&|$)')
var newUrl = url.replace(pattern,'$1' + paramValue + '$2');
var n=url.indexOf(paramName);
alert(n)
if(n == -1){
newUrl = newUrl + (newUrl.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue
}
window.location.href = newUrl;
Здесь нет необходимости сохранять переменную "url", просто замените в текущем URL
Ответ 10
попробуй это
var updateQueryStringParam = function (key, value) {
var baseUrl = [location.protocol, '//', location.host, location.pathname].join(''),
urlQueryString = document.location.search,
newParam = key + '=' + value,
params = '?' + newParam;
// If the "search" string exists, then build params from it
if (urlQueryString) {
var updateRegex = new RegExp('([\?&])' + key + '[^&]*');
var removeRegex = new RegExp('([\?&])' + key + '=[^&;]+[&;]?');
if( typeof value == 'undefined' || value == null || value == '' ) { // Remove param if value is empty
params = urlQueryString.replace(removeRegex, "$1");
params = params.replace( /[&;]$/, "" );
} else if (urlQueryString.match(updateRegex) !== null) { // If param exists already, update it
params = urlQueryString.replace(updateRegex, "$1" + newParam);
} else { // Otherwise, add it to end of query string
params = urlQueryString + '&' + newParam;
}
}
// no parameter was set so we don't need the question mark
params = params == '?' ? '' : params;
window.history.replaceState({}, "", baseUrl + params);
};
Ответ 11
У меня есть лучшее решение для замены параметра URL.
Следующая функция заменит номер комнаты на 3 в следующем URL.
var newurl = replaceUrlParam('room','3');
history.pushState(null, null, newurl);
function replaceUrlParam(paramName, paramValue){
var url = window.location.href;
if (paramValue == null) {
paramValue = '';
}
var pattern = new RegExp('\\b('+paramName+'=).*?(&|#|$)');
if (url.search(pattern)>=0) {
return url.replace(pattern,'$1' + paramValue + '$2');
}
url = url.replace(/[?#]$/,'');
return url + (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue;
}
Выход
http://example.com/property/?min=50000&max=60000&room=3&property_type=House
Ответ 12
Я использую этот метод, который:
- заменить URL в истории
-
вернуть значение удаленного параметра
function getUrlParameterAndRemoveParameter(paramName) {
var url = window.location.origin + window.location.pathname;
var s = window.location.search.substring(1);
var pArray = (s == "" ? [] : s.split('&'));
var paramValue = null;
var pArrayNew = [];
for (var i = 0; i < pArray.length; i++) {
var pName = pArray[i].split('=');
if (pName[0] === paramName) {
paramValue = pName[1] === undefined ? true : decodeURIComponent(pName[1]);
}
else {
pArrayNew.push(pArray[i]);
}
}
url += (pArrayNew.length == 0 ? "" : "?" + pArrayNew.join('&'));
window.history.replaceState(window.history.state, document.title, url);
return paramValue;
}