2012-09-09 5 views
4

훌륭한 jquery Ajax 기능을 가진 다른 페이지를 호출하는 웹 페이지에서 작업하고있다. 내 문제는 : ajax 페이지에 CSS 파일이 있습니다. 호출되는 페이지는 필요하지만 내 메인 페이지에서 하위 페이지의 CSS 스타일을보고 싶지 않습니다.Ajax CSS가 JQuery Ajax로 메인 CSS를 망가 뜨리지 못하도록 막는다.

<script> 
$.ajax({ 
type: "GET", 
    url: "subpage.html", 
    success: function(msg){ 
     $('#box').html(msg); 
    } 
}); 
</script> 

<div id='box'> 
</div> 

그래서, subpage.html 내 프로젝트의 다른 모듈에 대한 인터페이스의 종류와 그것의 자신의 CSS 파일이 : 여기

내가 내 하위 페이지를 호출하는 방법을 요약 한 것입니다. 모든 위대한 지식이나 트릭은 내 메인 페이지에서 그 CSS 파일을 방지하기 위해? PHP 솔루션도 사용할 수 있습니다.

답변

0

iframe (W3C reference, MDN reference)을 사용할 수 있습니다. 이 페이지를로드 할 때 다음

<iframe id = "iframeID" height = "300px" width = "300px"></iframe> 

: : 자바 스크립트를 사용하여 iframe의 특정 페이지를로드하기 위해이 같은, HTML을 사용하는 대신이의

document.getElementById("iframeID").src = "subpage.html"; 
+0

글쎄, 왜 그런지 모르겠지만 사람들은 아약스가있을 때 iframe을 사용하는 것을 좋아하지 않는다. 그래서 나는이 포스트에서 부정적인 표시를 보았다. 어쨌든, 나는 고맙게도이 해결책을 받아 들인다. –

+0

당신의 제목이 당신이 찾고 있던 것을 더 잘 나타내는 것이라면 커뮤니티 전체에 도움이 될 것입니다. 나에게 당신은 Ajax로드를 유지하면서 솔루션을 찾고있는 것처럼 보이지만, 당신이 받아 들였던 대답은 Ajax로드를 완전히 대체 할 것처럼 보인다. 아마도 귀하의 제목은 "다른 방법으로 아약스와 별개로 메인 페이지로로드"라는 라인을 따라 어딘가에 있어야합니다. 실제로는 2 센트 정도 =) – vynx

+0

실제로 원래는 대체품을 찾고 있지는 않지만 몇 개의 jquery .contents() 트릭 나는 문제를 처리 할 수 ​​있었고, 아약스로 그것을 할 수있는 또 다른 방법이 있다면, 나는 그것을 고맙게 생각하고 대답을 받아 들일 것이다. 그래서 1 주일 동안이 페이지를 확인해 보겠습니다. =) –

0

을, 당신은 jQuery를 사용할 수 있습니다 과 같이 .load :

$('#box').load('subpage.html #the_id_of_something'); 

이 예에서는 PA에 #boxsubpage.html에서 #the_id_of_something의 내용을로드합니다 ge.

+0

OP가 원하는 것이 아닌지 확실히 확인하십시오. – Chris

+0

요점은'subpage.html'에서 다양한 요소를로드하려고하지만'subpage.html' 내부에 정의 된 CSS가 페이지의 나머지 부분에 영향을주지 않는다는 것입니다. – Chris

+0

그는 단지'html'을 선택자로 사용할 수 없으며'head'에서 정의 된 CSS를 얻지 못할까요? –

관련 문제