URL에 추가 및 새로 고침 페이지
현재 URL에 매개 변수를 추가하고 페이지를 새로 고치는 자바스크립트를 작성하려고 합니다. 어떻게 해야 합니까?
해결책:
let url = window.location.href;
if (url.indexOf('?') > -1){
url += '¶m=1'
} else {
url += '?param=1'
}
window.location.href = url;
인정된 답변보다 짧지만, 동일한 작업을 수행하지만, 단순하게 유지합니다.
window.location.search += '¶m=42';
전체 url을 변경할 필요는 없고, 위치의 검색 속성으로 알려진 쿼리 문자열만 변경할 필요가 있습니다.
검색 속성에 값을 할당할 때 브라우저에 의해 자동으로 물음표가 삽입되고 페이지가 다시 로드됩니다.
여기서 대부분의 답변은 다음 토막글이나 그와 유사한 변형과 같은 매개 변수를 URL에 추가해야 한다고 제안합니다.
location.href = location.href + "¶meter=" + value;
이것은 대부분의 경우에 상당히 효과적일 것입니다.
하지만
제 생각에는 URL에 매개 변수를 추가하는 방법이 올바르지 않습니다.
제안된 방법은 URL에 파라미터가 이미 설정되어 있는지 테스트하지 않기 때문에 주의하지 않으면 동일한 파라미터가 여러 번 반복되는 매우 긴 URL로 끝날 수 있습니다.즉:
https://stackoverflow.com/?¶m=1¶m=1¶m=1¶m=1¶m=1¶m=1¶m=1¶m=1¶m=1
이 시점에서 문제가 시작됩니다.제안된 방법은 여러 페이지를 새로 고친 후 매우 긴 URL을 생성할 수 있고 생성할 수 있으므로 URL이 유효하지 않습니다.긴 URL에 대한 자세한 내용을 보려면 이 링크를 누르십시오. 다른 브라우저에서 URL의 최대 길이는 얼마입니까?
이것이 제가 제안한 방법입니다.
function URL_add_parameter(url, param, value){
var hash = {};
var parser = document.createElement('a');
parser.href = url;
var parameters = parser.search.split(/\?|&/);
for(var i=0; i < parameters.length; i++) {
if(!parameters[i])
continue;
var ary = parameters[i].split('=');
hash[ary[0]] = ary[1];
}
hash[param] = value;
var list = [];
Object.keys(hash).forEach(function (key) {
list.push(key + '=' + hash[key]);
});
parser.search = '?' + list.join('&');
return parser.href;
}
이 기능을 사용하면 다음 작업을 수행할 수 있습니다.
location.href = URL_add_parameter(location.href, 'param', 'value');
최신 브라우저용으로 개발하는 경우 url 매개 변수를 직접 구문 분석하는 대신 내장 함수를 사용하여 다음과 같이 작업할 수 있습니다.
const parser = new URL(url || window.location);
parser.searchParams.set(key, value);
window.location = parser.href;
location.href = location.href + "¶meter=" + value;
JS 코드의 이 줄은 (즉, 이전에) 매개변수 없이 링크를 사용합니다.'?'
)에 매개 변수를 추가합니다.
window.location.href = (window.location.href.split('?')[0]) + "?p1=ABC&p2=XYZ";
위 코드 라인은 두 개의 파라미터를 추가하고 있습니다.p1
그리고.p2
각자의 가치관을 가지고'ABC'
그리고.'XYZ'
(이해를 돕기 위해)
function gotoItem( item ){
var url = window.location.href;
var separator = (url.indexOf('?') > -1) ? "&" : "?";
var qs = "item=" + encodeURIComponent(item);
window.location.href = url + separator + qs;
}
더 호환되는 버전
function gotoItem( item ){
var url = window.location.href;
url += (url.indexOf('?') > -1)?"&":"?" + "item=" + encodeURIComponent(item);
window.location.href = url;
}
아래 코드를 확인해주시기 바랍니다.
/*Get current URL*/
var _url = location.href;
/*Check if the url already contains ?, if yes append the parameter, else add the parameter*/
_url = ( _url.indexOf('?') !== -1 ) ? _url+'¶m='+value : _url+'?param='+value;
/*reload the page */
window.location.href = _url;
위의 @yyeyo의 사려깊은 답변을 위한 작은 버그 수정 하나.
변경 사항:
var parameters = parser.search.split(/\?|&/);
받는 사람:
var parameters = parser.search.split(/\?|&/);
이거 먹어봐요.
var url = ApiUrl(`/customers`);
if(data){
url += '?search='+data;
}
else
{
url += `?page=${page}&per_page=${perpage}`;
}
console.log(url);
또한:
window.location.href += (window.location.href.indexOf('?') > -1 ? '&' : '?') + 'param=1'
북마크렛에서 사용할 수 있는 Shlomi 답변의 라이너 하나.
언급URL : https://stackoverflow.com/questions/5997450/append-to-url-and-refresh-page
'programing' 카테고리의 다른 글
MySQL에서 현재 타임스탬프 내에 10분 이내인 모든 레코드를 선택하는 방법은 무엇입니까? (0) | 2023.09.24 |
---|---|
((무부호 char)0x80) << 24가 0xFFFFFF800000(64비트)로 확장되는 이유는 무엇입니까? (0) | 2023.09.24 |
Angular Mat Paginator가 초기화되지 않음 (0) | 2023.09.24 |
Oracle에서 varchar2 PL/SQL 하위 프로그램 인수의 크기 제한은 무엇입니까? (0) | 2023.09.24 |
jQuery/AJAX를 사용하여 양식 데이터를 새 창에 게시하는 방법? (0) | 2023.09.24 |