2012-05-28 5 views
0
여기

는 예 페이지 점프 페이지 B 인 영향을 미치지, 페이지 B는 자체 예컨대 CSS 참조, B에 대한 페이지 A의JQuery와 모바일 AJAX 점프

CSS없는 효과를 갖는다 :

/* page A start */

<head> 
    <link rel="stylesheet" href="jquery.mobile.css" /> 
    <script src="jquery.mobile.js"></script> 
</head> 
<body> 
    <div data-role="page"> 
     <a href="B.html" data-role="button" data-theme="a">this is A</a> 
    </div> 
</body> 

/* page A end */

/* page B start */

<head> 
    <link rel="stylesheet" href="jquery.mobile.css" /> 
    <script src="jquery.mobile.js"></script> 
    <style> 
     a{ 
      color : red !important; 
     } 
     #a{ 
      height : 100px; 
      width : 100px; 
      color : red; 
     } 
    </style> 
</head> 
<body> 
    <div data-role="page" > 
     <a href="A.html" data-role="button" data-theme="a">this is B</a> 
     <div id="a">bbb</div> 
    </div> 
</body> 

/* page B end */

점프는 색상이 'DIV'설정되지 높이와 너비를 변경하지 아약스와 B로, 그래서

사업부 '데이터 역할'태그 '를'을 넣어 찾을 = " 페이지 "효과가 있습니다 만, 다른 것이 있습니다

해결 방법은 있습니까? 아약스와 스타일을 B 페이지에 넣으십시오.

답변

0

본문 섹션에 스타일 태그를 넣으십시오.

<body> 
<style> 
    a{ 
     color : red !important; 
    } 
    #a{ 
     height : 100px; 
     width : 100px; 
     color : red; 
    } 
</style> 
</body> 
+0

더 좋은 해결책이 있습니까? – Shadow

+0

링크 확인 http://jquerymobile.com/demos/1.1.0/#/demos/1.1.0/docs/api/events.html –

0

JQM은 ajax를 통해 두 번째 페이지를로드 할 때 <head> 섹션의 모든 내용을 무시합니다. 여기에는 스크립트와 CSS가 포함됩니다. 가장 좋은 해결책은 모든 페이지에 포함되는 자신 만의 외부 CSS 파일을 만드는 것입니다. <head> 안에있는 모든 것을 무시하면 왜 그렇게 생각하니? 글쎄, 누군가가 페이지를 새로 고치거나 링크 (이메일 또는 소셜 사이트)를 통해 해당 페이지로 오는 경우입니다. 당신이 이것을 할 때 당신은 당신의 CSS에 더 구체적 일 필요가있을 것이다. 즉

#page2 a{ 
    color : red !important; 
} 
#page2 #a{ 
    height : 100px; 
    width : 100px; 
    color : red; 
}