Ajax tải div, một phần của CSS không hoạt động

Question

Tôi đang sử dụng ajax để tải nội dung div, nhưng nội dung div không lấy CSS của trang.

Ví dụ: - Liên kết này sẽ được tải vào

<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> 

Trong CSS của tôi:

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; 
} 

Trong test.html của tôi, đó là cùng một bảng với kỷ lục khác nhau:

<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> 

Vấn đề tôi phải đối mặt là trước khi "test.html" tải, CSS vẫn ổn. Nhưng sau khi nhấp vào liên kết giả sử tải test.html, nền CSS vẫn hiển thị nhưng "con trỏ: con trỏ" và "hình nền" không còn hoạt động nữa.

Tôi nên làm gì để nó hoạt động? Cảm ơn bạn trước!

gia tăng trong các mã loadAjax:

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.'); 
     } 
     } 
    } 

Answer 1

thử thêm css cùng test.html tập tin. Nếu bạn đang thực sự sử dụng khung nội tuyến hoặc nhúng trang vào một khung nội tuyến khác thì CSS sẽ không xếp vào trang được nhúng. Nó được kết xuất dưới dạng tài liệu riêng của nó.

Cập nhật: Có vẻ như bạn có thể cần thêm lớp vào ô đầu tiên trong hàng để làm cho nó được tạo kiểu. Test.html không có bất kỳ phần tử nào trong đó được tạo kiểu bởi phần thứ hai của CSS vì nó không khớp với bất kỳ phần tử nào.

<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>