AJAX一次又一次地加载iFrame

时间:2014-09-11 10:02:28

标签: javascript php ajax iframe

我有iFrameA和iFrameB来显示数据。我有AJAX代码,它将从mySQL获取ID并根据ID显示视频。 AJAX将每隔几秒检查一次代码。假设我在iFrameA中显示ID 1,在iFrameB中显示ID 2,在iFrameB中显示视频B.如果有人在数据库中输入1,则将显示视频A,直到输入ID 2。但AJAX将在每一秒继续其任务。

我正在尝试下面的代码,但是每隔一秒iFrame就会重新加载。我想如果视频A显示没有人输入ID 2,那么视频2将继续显示而不重新加载。

main.html中

<!DOCTYPE html>
<html>
<head>

<title> View</title>

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
    $(function(){
        function values(){
           $.ajax({
               type: "GET", 
               url: "task.php",
               success: function(data){
                  $('div#myFrame').html(data);
               }
           });
       };
       setInterval(values, 1000);
    });
</script>

</head>
<body>
<a>
    <div id="myFrame">
    <?php

    include "task.php";  
    ?>
    </div>
</a>
</body>
</html>

test.php的

<?php



//connect database and find

        switch ($ID) {
            case 1:
                    echo '<div>';
                    echo '<iframe src="../video/index.php" id="imgiframe"></iframe>';
                    echo '</div>';                          
                break;
                case 2:     
                    echo '<div>';
                    echo '<iframe src="../video/index.php" id="imgiframe"></iframe>';
                    echo '</div>';
                break;                    
                default:
                    echo "NO VIDEO";
                break;
            }  
?>

1 个答案:

答案 0 :(得分:0)

您可以检查您收到的数据是否与上一次相同,然后您不会更改任何内容。

$(function(){
    var lastData = '';
    function values(){
       $.ajax({
           type: "GET", 
           url: "task.php",
           success: function(data){
                if (data != lastData) {
                    $('div#myFrame').html(data);
                    lastData = data;
                }
           }
       });
   };
   setInterval(values, 1000);
});