首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >为什么当从另一个php页面调用Ajax时,CSS无法工作?

为什么当从另一个php页面调用Ajax时,CSS无法工作?
EN

Stack Overflow用户
提问于 2018-07-23 08:35:27
回答 1查看 0关注 0票数 0

我所使用的php页面可以很好地使用我应用的CSS。但是,当我使用Ajax从另一个php页面调用此页面时,CSS在该页面上不起作用。原因是什么?我如何解决这个问题?

注意:我用下面的php代码更新了我原来的问题。

代码语言:txt
复制
<html>
<head>
 <style>
.tbrep {
    border: 1px solid #CCC; font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-collapse:collapse; 
    width: 8%;
    margin: 8px; 
    float: left;
    margin-left:25px; 
} 
.tbrep td {
    padding: 2px; 
    margin: 2px;
    border: 1px solid #ccc;
    text-align: center;
    height:15px;
    width: 10px;  
    white-space: nowrap;
}
.tbrep th {
    background-color: whitesmoke; 
    color:rosybrown;
    border: 1px solid #ccc;
    font-weight: bold;
    width: 10px;  
    white-space: nowrap;
}

td[data-content="1"]{
  background-color: #f7b7e9 ;
}

td[data-content="2"]{
  background-color: #98ade0;
}

</style>
<script type="text/javascript" src="etc/jquery-2.1.4.js"></script>
<script>
$(function(){
  $("td").each(function(){
    var $this = $(this);
    $this.attr("data-content", $this.text());
  });
});
</script>
</head>
<body>

 <table class="tbrep">
 <tr>

  <th>RDA</th> 
  <th>RDB</th>

   </tr>


 <?php

  include ("config.php");


  $sql = "SELECT RDA, RDB FROM stats";
  $result = $conn->query($sql);
  if ($result->num_rows > 0) {

  $counter = 3;

   while($row = $result->fetch_assoc()) 
   {
        echo "<tr><td>" . $row["RDA"] . "</td><td>" . $row["RDB"]. "</td></tr>";


            $counter++;
            if($counter % 33 == 0) { ?>
</table>

<table class="tbrep">
<tr>

  <th>RDA</th> 
  <th>RDB</th>

   </tr>

            <?php }
    }
echo "</table>";

} else { echo "0 results"; }
$conn->close();
?>     
</table>        


    </body>
</html>

我的Ajax代码如下:

代码语言:txt
复制
 <script>  
   document.getElementById('actbutton1').onclick = function() {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "formquery.php", true);

            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    document.getElementById("querydiv").innerHTML = xhr.responseText;
                }
            }
            xhr.send();
        }
    </script>
EN

回答 1

Stack Overflow用户

发布于 2018-07-23 17:44:05

这与url路径有关,当进行Ajax调用时,它将页面作为一个片段注入到调用脚本文件中。你需要在当前脚本文件的头中包含CSS的位置。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/-100005643

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档