programing tip

페이지를 변경하는 방법

itbloger 2020. 9. 3. 07:50
반응형

페이지를 변경하는 방법


JavaScript 내에서 페이지를 변경하는 다음 코드가 있습니다.

var newUrl = [some code to build up URL string];
window.location.replace(newUrl);

그러나 상위 URL은 변경되지 않으므로 누군가가 뒤로 버튼을 클릭해도 이전 페이지로 돌아 가지 않습니다.

JavaScript가 상단 URL을 변경하여 브라우저 뒤로 버튼이 작동하도록하려면 어떻게해야합니까?


document.location.href = newUrl;

https://developer.mozilla.org/en-US/docs/Web/API/document.location


간단하게 할당 window.location하거나 window.location.href괜찮아 야합니다.

window.location = newUrl;

그러나 새 URL로 인해 브라우저가 새 페이지를로드하게되지만 현재 페이지를 벗어나지 않고 URL을 수정하려는 것 같습니다. 이에 대한 두 가지 옵션이 있습니다.

  1. URL 해시를 사용하십시오. 예를 들어 새 페이지를로드하지 않고 에서 example.com이동할 수 있습니다 example.com#foo. window.location.hash이 작업을 쉽게하도록 설정할 수 있습니다 . 그런 다음 hashchange사용자가 뒤로 버튼을 누르면 시작되는 HTML5 이벤트를 수신해야 합니다. 이것은 이전 버전의 IE에서는 지원되지 않지만 모든 브라우저에서 작동하는 jQuery BBQ를 확인하십시오 .

  2. HTML5 기록을 사용하여 페이지를 다시로드하지 않고도 경로를 수정할 수 있습니다. 이것은 당신이에서 변경할 수 있습니다 example.com/fooexample.com/bar. 이것을 사용하는 것은 쉽습니다.

    window.history.pushState("example.com/foo");

    사용자가 "뒤로"를 누르면 창 popstate이벤트를 받게되며 ,이를 쉽게들을 수 있습니다 (jQuery).

    $(window).bind("popstate", function(e) { alert("location changed"); });

    불행히도 이것은 Chrome, Safari 및 Firefox 4 베타와 같은 최신 브라우저에서만 지원됩니다.


흠, 사용하겠습니다

window.location = 'http://localhost/index.html#?options=go_here';

그게 무슨 뜻인지 정확히 모르겠습니다.


상대 경로 만 업데이트하려면 다음을 수행 할 수도 있습니다.

window.location.pathname = '/relative-link'

"http://domain.com" -> "http://domain.com/relative-link"


<script> 
    var url= "http://www.google.com"; 
    window.location = url; 
</script> 

참고 URL : https://stackoverflow.com/questions/3846935/how-to-change-page-from

반응형