HTML5 페이지를 HTML5 페이지로로드하려면 어떻게해야합니까?

HTML5에서 간단한 정적 앱을 만들고 있습니다.HTML5 페이지를 HTML5 페이지로로드하려면 어떻게해야합니까?

내가 지금하고있는 일은 수천 줄의 코드가있는 하나의 긴 페이지가 있다는 것입니다.

나는 현재 다른 페이지로 이동하기 위해이 일을하고있다 :

<div data-role="content"> 
    <label for="heading">History</label> 
    <a href="#module_a" data-role="button" data-icon="arrow-r" data-iconpos="right" data-transition="flip">History</a> 
    <a href="module_b" data-role="button" data-icon="arrow-r" data-iconpos="right">Remote Control</a> 
</div>

... 그리고 내가 따를 module_a & module_b이 ...

<div id="module_a" data-role="page"> 
    //content 
</div>

... 그리고 대한 동일 module_b

두 div가 같은 페이지에 있으므로 내 페이지가 매우 나빠 보입니다.

내가 원하는 것은 동일한 기능이 필요하지만 같은 페이지에서 module_a와 module_b 인 div는 필요 없다는 것입니다.

다른 페이지를 만들고 나서 메인 페이지가 선명하게 보이도록로드하고 싶습니다.

출처

2012-06-29 Edward Maya

편집 도움이되기를 바랍니다 플러스, 나는 당신이 요구되었다 믿는 것을 기반으로 태그를 변경하여 문제를 해결할 것입니다. 그들이 틀렸다면 알려주세요. –

토마스 : "그다지"와 "그 다음"을 잊어 버렸습니다. ;-) –

@ 빅터 잘 봤어! –

내가 정확히 묻는 것을 수집하면 AJAX를 원한다. 링크/버튼 중 하나를 클릭하면 다른 페이지의 HTML을 가져 와서 페이지의 특정 위치에로드하라는 요청을 보내는 자바 스크립트 코드가 필요합니다.

가장 좋은 방법은 jQuery를 사용하는 것입니다. 그것은 정확히 당신이 필요로하는 load()라고 불리는이 유용한 기능을 가지고 있습니다. http://api.jquery.com/load/

그것은 다음과 같습니다 도움이

$('#containerWhereYouWantTheContentToLoad').load('http://url.to/content/you/want/to/load.html');

희망을.

출처

2012-06-29 08:25:14

이 작동합니다 :

가 자신의 파일에 각 모듈을 넣습니다.
모듈에 대한 링크가 수정되어 모듈 파일에 링크됩니다.
원본 파일의 모듈을 태그로 바꿉니다.
의 src 특성을 모듈 파일의 URL로 설정하고 링크가 뒤 따르지 않도록 false을 반환하는 각 링크에 이벤트 처리기를 추가하십시오.

그러나 AJAX as suggested by @ThomasClayson과 함께 사용하면로드하는 HTML로 더 많은 작업을 할 수 있습니다.

출처

2012-06-29 08:25:18

AJAX를 사용해 보셨습니까? 내가 질문을 이해하는 방법에서

$.ajax({ 
    url: 'seperate_page.html', 
    success: function(data) { 
    $('#module_b').html(data); 
    } 
});

,이 ..이 맞춤법 및 서식

출처

2012-06-29 08:29:47 mithilatw

HTML5 페이지를 HTML5 페이지로로드하려면 어떻게해야합니까?

답변

관련 문제