2010-05-18 15 views
5

Div içeriğini yüklemek için ajax kullanıyorum, ancak div içeriği sayfanın CSS'sini almıyor.Ajax load div, çalışmayan CSS parçası

Örnek: - Bu bağlantı benim BB'de

<a href="#" onclick="javascript:loadAjax('test.html')">Test</a> 

<div id="result"> 
<table class="tablesorter"> 
<thead> 
    <tr> 
     <th>Header 1</th><th>Header 2</th> 
    </tr> 
</thead> 
<tbody> 

    <tr><td>Record 1</td><td>Desc 1</td></tr> 
</tbody>  
</table> 
</div> 

yüklenecek:

<table class="tablesorter"> 
    <thead> 
     <tr> 
      <th>Header 1</th><th>Header 2</th> 
     </tr> 
    </thead> 
    <tbody> 

     <tr><td>Record 2</td><td>Desc 2</td></tr> 
    </tbody>  
    </table> 
: Benim test.html olarak

table.tablesorter thead tr th, table.tablesorter tfoot tr th { 
    background-color: #e6EEEE; 
    border: 1px solid #FFF; 
    font-size: 8pt; 
    padding: 4px; 
} 

table.tablesorter thead tr .header { 
    background-image: url(bg.gif); 
    background-repeat: no-repeat; 
    background-position: center right; 
    cursor: pointer; 
} 

, farklı kayıtla aynı tablo var

Karşılaştığım sorun, "test.html" yüklenmeden önce CSS'nin iyi olmasıdır. Ancak test.html dosyasını yüklediğini varsayan linke tıkladıktan sonra, CSS arka planı hala görünüyor, ancak "imleç: işaretçi" ve "arka plan resmi" artık çalışmıyor.

Çalıştırmak için ne yapmalıyım? Şimdiden teşekkürler! loadAjax kodunda

Eklendi: Dosya test.html aynı css ekleyerek

var http_request = false; 
    function loadAjax(url, parameters) { 
     http_request = false; 
     if (window.XMLHttpRequest) { // Mozilla, Safari,... 
     http_request = new XMLHttpRequest(); 
     if (http_request.overrideMimeType) { 
      // set type accordingly to anticipated content type 
      //http_request.overrideMimeType('text/xml'); 
      http_request.overrideMimeType('text/html'); 
     } 
     } else if (window.ActiveXObject) { // IE 
     try { 
      http_request = new ActiveXObject("Msxml2.XMLHTTP"); 
     } catch (e) { 
      try { 
       http_request = new ActiveXObject("Microsoft.XMLHTTP"); 
      } catch (e) {} 
     } 
     } 
     if (!http_request) { 
     alert('Cannot create XMLHTTP instance'); 
     return false; 
     } 
     http_request.onreadystatechange = alertContents; 
     http_request.open('GET', url + parameters, true); 
     http_request.send(null); 
    } 

    function alertContents() { 
     if (http_request.readyState == 4) { 
    // alert(http_request.status); 
     if (http_request.status == 200) { 
      //alert(http_request.responseText); 
      result = http_request.responseText; 
      document.getElementById('result').innerHTML = result;    
     } else { 
      alert('There was a problem with the request.'); 
     } 
     } 
    } 
+0

loadAjax 'kodu()' –

+0

Merhaba Delan, komut dosyasına eklenen mı veriniz. :) teşekkürler – Sylph

cevap

3

deneyin. Bir iframe kullanıyor veya bir sayfayı başka bir sayfaya katıyorsanız, CSS katıştırılmış sayfaya geçmez. Kendi dokümanı olarak işlenmiştir.

Güncelleme: Çizgiyi biçimlendirmek için satırdaki ilk hücreye bir sınıf eklemeniz gerekebilir gibi görünüyor. Test.html'de, herhangi bir öğe ile eşleşmediği için CSS'nin ikinci bölümü tarafından biçimlendirilmiş hiçbir öğe yoktur.

<table class="tablesorter"> 
    <thead> 
     <tr> 
      <th>Header 1</th><th>Header 2</th> 
     </tr> 
    </thead> 
    <tbody> 

     <tr><td class="header">Record 2</td><td>Desc 2</td></tr> 
    </tbody>  
    </table> 
+0

Teşekkürler, test.html içine aynı css ekledim, ama aynı sonucu elde ediyorum. CSS'yi izlemek için IE geliştirici aracını kullanmaya çalıştım. "İmleç" ve "arkaplan görüntüsü" haricinde diğer tüm CSS'yi görebiliyorum .. Neden acaba :( – Sylph

+0

Yukarıda gösterildiği gibi üstbilgi sınıfını hücreye eklemeye çalışıyorum. imleç ve bg, sayfadaki herhangi bir öğeyle eşleşmiyor. – Banzor

+0

Teşekkürler Banzor !! CSS için çalışıyor. Ancak, javascript için bana yardımcı olabilir misiniz acaba? Ben bir js işlevi var başlık tıklatıldığında tablo http://tablesorter.com/docs/ Bu işlev, div ajax ile yüklendikten sonra çalışmaz Tekrar teşekkürler! – Sylph