Question

我正在刷新一个带有ajax调用的div，如果没有样式应用于div，它似乎运行良好。一旦我将任何样式应用于div，当ajax调用完成时div会闪烁。所以div每秒都在闪烁。

我已经阅读了许多文章，他们说要刷新一个隐藏的div然后用隐藏div中的内容替换可见的div，但是在深入研究时我发现有时Ajax调用无法及时完成发生？我有点不知道为此做些什么。

我对Ajax比较陌生，所以任何提示，提示，技巧等都会很酷。

CSS

#Wrapper{
    background-color: silver;
}

#OilTempTag {
    float:left;
}
#OilTempTag section {
    width: 50%; 
    float: left;
}

主要HTML

<!doctype html>
<html>
<head>
<script src="../Jquery/jquery-1.11.3.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="../css/main.css">
<!--auto refresh div function-->
<script>


$(document).ready(function() {
    setInterval(function() {
        $.get('load.shtm', function (data) {
            $('.compOverview').html(data);
        });
    }, 1000); 
});
</script>


<meta charset="utf-8">
<title>Compressor Overview</title>
</head>

<body>
<div id="Wrapper">
<center><h1>COMPRESSOR OVERVIEW</h1></center>

<center><div class="compOverview">

</div>

</center>
</div>
</body>
</html>

页面Ajax正在调用

<head>
<link rel="stylesheet" href="../css/main.css">
</head>


<div id="overviewtable">
    <section id="OilTempTag">
        Oil Temperature: 
    </section>
    <section id="OilTempValue">
     <%#TagSSI,Oil_Temp%>
     </section>
        <br>
    <section id="ControllerStateTag">
        Controller State: <%#TagSSI,Controller_State%>
    </section>
        <br>
    <section id="DischargeTempTag">
        Discharge Temperature: <%#TagSSI,Discharge_Temp%>
    </section>
        <br>
    <section id="PlantPressureTag">
        Plant Pressure: <%#TagSSI,Plant_Pressure%>
    </section>    
        <br>
    <section id="TotalHoursTag">
        Total Hours: <%#TagSSI,Total_Hours%>
    </section>
</div>

当css添加到div时，Ajax调用使div闪烁

0 个答案: