2011-02-03 5 views
1

내 응용 프로그램에 mootools v1.3을 사용하고 있습니다. myCSS.php와 myContent.php에 두 개의 비동기 호출을 구현했습니다. 먼저 CSS를 로딩하여 < body> 태그 < 스크립트> 태그 안에 맨 위에 붙입니다. 내용은 < body> 태그 맨 아래에로드됩니다.요청 클래스에 의해로드 된 내용에 CSS를 첨부하여로드하는 방법

비동기 호출은 다음과 같습니다

<div class="content_disp"> some data...... </div> 

문제가 표시되지 않습니다이다 :

var myRequest = new Request({ async: false, method: 'post', 
onSuccess: function(html) { /* Code to attach html value in <body> tag */ }, 
}); 
myRequest.send({url: myCSS.php}); 
myRequest.send({url: myContent.php}); 

는 CSS에서 클래스

.content_disp { 
padding: 10px; border: 1px solid #333; } 

그리고 myContent.php에있다 CSS 클래스 .content_disp의 속성을 사용합니다. 어디서 가져 오는 지 알 수 없습니다. rong ...

답변

2

Mootools More의 Asset 클래스가 어떻게 동작하는지 살펴보아야합니다. css는 링크 요소에 먼저 적용되고 문서 요소 헤드에 삽입됩니다. 샘플에서 원시 css 소스를 어떤 요소에 삽입하는지 명확하지 않습니다.

css: function(source, properties){ 
    properties = properties || {}; 
    var onload = properties.onload || properties.onLoad; 
    if (onload){ 
     properties.events = properties.events || {}; 
     properties.events.load = onload; 
     delete properties.onload; 
     delete properties.onLoad; 
    } 
    return new Element('link', Object.merge({ 
     rel: 'stylesheet', 
     media: 'screen', 
     type: 'text/css', 
     href: source 
    }, properties)).inject(document.head); 
}, 
+0

기능 (HTML) { document.body.innerHTML = '<스크립트 유형 = "텍스트/CSS" > '+ html +'

'+ document.body.innerHTML; } : 요청 개체에 대한 onSuccess 이벤트를 처리하는 코드입니다. – Vin

+0

감사합니다 ... !! 나는 해결책을 얻었다. myRequest의 onSuccess 이벤트를 처리하는 코드입니다. 나는 "document.body.innerHTML"을 "document.head.innerHTML"로 변경했다. – Vin

0

워진 작업 코드는 다음과 같습니다

var myRequest = new Request({ async: false, method: 'post', 
onSuccess: function(html) { 
document.head.innerHTML = document.head.innerHTML + 
'<style type="text/css"> ' + html + ' </style><div id="data_loader"></div>'; 
} }); 
myRequest.send({url: 'myCSS.php'}); 
myRequest.send({url: 'myContent.php'}); 

감사 leeb :

관련 문제