페이지의 일부분이 정적 인 상태에서 div 콘텐츠를 동적으로 변경하고 북마크를 생각하면 어떤 콘텐츠 에든 직접 액세스 할 수 있습니까?

Question

먼저,이 사이트는 일부 학교 프로젝트를 통해 엄청난 도움을주었습니다. 제 질문이 특정 답변에 충분할 것으로 기대합니다.

내가하고 싶은 것은 내 페이지에서 div의 내용을 변경하는 것입니다 ('#content'라고 부름). 또한 변경하여 생성되는 다양한 '페이지'에 직접 액세스 할 수 있습니다. div의 콘텐츠

예를 들어, "foo.com/home"이 홈 페이지가됩니다. '#content'div는 홈 페이지의 코드로 채워 져야하지만 주변의 다른 요소는 고정되어 있습니다 (예 : 머리글, 바닥 글 및 탐색 div). 마찬가지로 "foo.com/forum"은 포럼의 코드로 '#content'를 채우고 다른 페이지도 똑같이 할 것입니다.

현재 URL 끝에있는 해시를 확인한 다음 jQuery의 load() 메소드를 사용하여 다양한 코드를 '#content'에로드합니다. 그러나 탐색을 위해 해시를 사용하는 것이 모바일 브라우저에서 까다로운 것처럼 보일뿐 아니라 은 나에게 잘못된이 있다고 느낍니다.

PHP를 사용하려고 생각하고 PHP를 사용하면 URL을 기반으로 '#content'에로드되는 코드가 변경됩니다. 예를 들어 "foo.com/page=forum"은 홈 페이지 (머리글/바닥 글, 탐색 등)와 동일한 (레이아웃이 현명한) 페이지를 가져 오지만 'content '에 다른 파일을 포함합니다 . ' 그러나 '#content'뿐만 아니라 전체 페이지가 다시로드됩니다.

이상적으로는 '#content'div를 다시로드하기 위해 AJAX 호출을 사용하고 싶습니다.하지만 URL 해시를 편집하는 것 이외에 책갈피를 허용하는 동안이를 수행하는 방법을 모르겠습니다. 등. 사용자가 "foo.com/home"또는 "foo.com/forum"으로 이동하여 올바른 내용으로 채워지는 "템플릿 페이지"(머리글/바닥 글, 탐색)로 끝내기를 바랍니다.

다시 말하지만,이 말은 잘못된 단어입니다. 나는 약간의 연구를 해왔지만 이것을 완성시키는 최선의 방법을 찾지 못하고있다. 미리 감사드립니다 - 어떤 조언을 부탁드립니다.

Answer 1

확인이 예제 코드 : 답장을

  var xmlhttp; 
     if (window.XMLHttpRequest) 
      { 
      xmlhttp=new XMLHttpRequest(); 
      } 
     else 
      { 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
     xmlhttp.onreadystatechange=function() 
      { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
       { 
      document.getElementById("content").innerHTML=xmlhttp.responseText; 

      } 
      } 
      var usernm = document.getElementById("username").value; 
      var pwd = document.getElementById("password").value; 
      var params = "username=" + usernm + "&password=" + pwd; 
      xmlhttp.open("POST","phpfile.php",true); 
      xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
      xmlhttp.send(params); 
      //xmlhttp.send(); without parameters