javascript jquery 파라미터 - 페이지를 다시로드하지 않고 URL 수정





9 Answers

HTML5에는 history.pushState()history.replaceState() 메소드가 추가되어 이력 항목을 각각 추가 및 수정할 수 있습니다.

window.history.pushState('page2', 'Title', '/page2.php');

이것에 대한 자세한 내용은 here 에서 읽어보십시오.

변경 현재 확인

페이지를 다시로드하지 않고 현재 페이지의 URL을 수정할 수있는 방법이 있습니까?

가능한 경우 # hash 앞에 있는 부분에 액세스하려고합니다.

도메인 의 부분 만 변경하면되므로 도메인 간 정책을 위반하는 것과 같지 않습니다.

 window.location.href = "www.mysite.com/page2.php";  // sadly this reloads



참고 : HTML5 브라우저로 작업하는 경우이 대답을 무시해야합니다. 이것은 이제 다른 답변에서 볼 수 있듯이 가능합니다.

페이지를 다시로드하지 않고 브라우저에서 URL 을 수정할 수있는 방법은 없습니다. URL은 마지막으로로드 된 페이지의 내용을 나타냅니다. 그것을 변경하면 ( document.location ) 페이지가 다시로드됩니다.

확실한 이유 중 하나는 www.mysite.com 에 은행 로그인 페이지처럼 보이는 사이트를 작성하는 것입니다. 그런 다음 브라우저 url 바를 www.mybank.com 변경하십시오. 사용자는 www.mysite.com 실제로보고 있다는 사실을 전혀 모릅니다.




여기 내 해결책은 : (newUrl 당신이 현재 하나를 대체하려는 새로운 URL입니다)

history.pushState({}, null, newUrl);



HTML5 이전에는 다음을 사용할 수 있습니다.

parent.location.hash = "hello";

과:

window.location.replace("http:www.example.com");

이 메소드는 페이지를 다시로드하지만 HTML5는 history.pushState(page, caption, replace_url) 다시로드하지 않아야하는 history.pushState(page, caption, replace_url) 를 도입했습니다.




URL 조각을 변경하는 것이 아니라면 loong ( window.location 또는 document.location )을 변경하면 해당 새 URL에 대한 요청이 발생합니다. URL을 변경하면 URL이 변경됩니다.

현재 사용중인 URL이 마음에 들지 않으면 Apache의 mod_rewrite 와 같은 서버 측 URL 재 작성 기술을 사용하십시오.




앵커 태그를 추가 할 수 있습니다. 나는 내 사이트 http://www.piano-chords.net/ 에서 이것을 사용하여 사람들이 페이지에서 무엇을 방문하는지 Google Analytics로 추적 할 수 있습니다. 앵커 태그를 추가 한 다음 추적하려는 페이지의 일부만 추가합니다.

var trackCode = "/#" + urlencode($("myDiv").text());
window.location.href = "http://www.piano-chords.net" + trackCode;
pageTracker._trackPageview(trackCode);



Thomas Stjernegaard Jeppesen이 지적한 것처럼 History.js 를 사용하여 사용자가 Ajax 링크와 앱을 탐색하는 동안 URL 매개 변수를 수정할 수 있습니다.

거의 1 년이 지났습니다. History.js는 성장하고 더 안정적이고 크로스 브라우저가되었습니다. 이제 HTML5 전용 및 많은 HTML4 전용 브라우저에서 기록 상태를 관리하는 데 사용할 수 있습니다. 이 데모에서는 어떻게 작동하는지 (예 : 기능 및 한계를 시험해 볼 수 있음)의 예를 볼 수 있습니다.

이 라이브러리를 사용하고 구현하는 방법에 대한 도움이 필요하면 데모 페이지의 소스 코드를 살펴 보는 것이 좋습니다. 매우 쉽게 할 수 있습니다.

마지막으로, 해시 (및 hashbangs) 사용에 관한 문제가 무엇인지 포괄적으로 설명하려면 Benjamin Lupton 이이 링크 를 확인하십시오.




HTML 5 History API의 history.pushState() 사용

자세한 내용은 링크를 참조하십시오. HTML5 기록 API




window.history.pushState("object or string", "Title", "/new-url") 를 사용하되 여전히 서버에 새로운 URL 요청을 보냅니다.




Related