Javascript 如何使用HTML上的switch case管理ajax代码以显示图像和视频_Javascript_Php_Html_Ajax

Javascript 如何使用HTML上的switch case管理ajax代码以显示图像和视频

javascript php html ajax

Javascript 如何使用HTML上的switch case管理ajax代码以显示图像和视频,javascript,php,html,ajax,Javascript,Php,Html,Ajax,我有两张桌子，图像和视频。在我的HTML代码中，我有三个按钮，分别是幻灯片、视频和单张图片。在这里，我使用iframe加载图像和视频，我在一个页面中可以看到视频/图像。所以，当我点击幻灯片图像按钮时，它会在网页中一个接一个地显示图像，当我点击视频时，它会显示视频。在这之前是可以的，但当我单击single_image按钮时，它不会显示任何内容，因为iframe ans开关的情况。我想当我点击单张图片按钮时，它只显示第三张图片我使用AJAX检查和加载页面，直到我得到新数据。但我的图像表只有一个

我有两张桌子，图像和视频。在我的HTML代码中，我有三个按钮，分别是幻灯片、视频和单张图片。在这里，我使用iframe加载图像和视频，我在一个页面中可以看到视频/图像。所以，当我点击幻灯片图像按钮时，它会在网页中一个接一个地显示图像，当我点击视频时，它会显示视频。在这之前是可以的，但当我单击single_image按钮时，它不会显示任何内容，因为iframe ans开关的情况。我想当我点击单张图片按钮时，它只显示第三张图片

我使用AJAX检查和加载页面，直到我得到新数据。但我的图像表只有一个，我在iframe中加载数据。注意,；在获取网络内容之前，我无法刷新页面，例如，现在我正在显示视频，但当仅单击“幻灯片图像”按钮时，新页面将加载到iframe中。我想我需要修改AJAX代码或case语句

<!DOCTYPE html>
<html>
<head>

<title> View</title>

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
$(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, 5000);
});
</script>

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

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

task.php

所以。。。这其实很难读懂。。只是因为我不认为您完全理解ajax在做什么。事实上，这在一开始是令人困惑的，直到你读了所有的东西并做了几次

所以。。。数据将类似于无视频且永远不会==lastData。。。数据是成功的回报

然而。。。我们可以从中得到一些乐趣。。您可以从单个ID开始

<script>
  $(function(){
    var lastData = 0; // set your data to 0 as that is the real original

    values(); // Go ahead and call the function on initialization so you can see it instantly.
    function values(){
      lastData += 1 // always increment by 1 if it is always one. You may need to fit this better for your situation.
      $.ajax({
        type: "POST", // You had GET 
        url: "task.php",
        data: {ID: lastData}, // You did not have this
        success: function(data){
          $('#myFrame').html(data);
          // if you have a better way to return lastData then do that here, but you will need to use json to get a better splitting of data.
        }
      });

   }
   setInterval(values, 5000);
  })(jQuery);
</script>

这会让你更好地了解正在发生的事情。您必须将数据发送到实际读取，然后当您在PHP文档中时，您将使用$_REQUEST['ID']，并使用它执行您想要的操作

查看ajax和json编码，更加熟悉布局以及应该如何进行

老实说，我不会这样对待视频/图像幻灯片放映。我会使用和替换源代码，或者用HTML5标记做一些非常类似的事情，因为它可以处理我的大部分需求。我不确定它是否属于你

是的。。沿着这些思路尝试一些东西，希望能对你有所帮助

这决不是一个完整的解决方案。我没有一个完整的项目概述来让您进入最终阶段，使用iFrame对我来说没有意义。我没有触及这一点是有原因的

<script>
  $(function(){
    var lastData = 0; // set your data to 0 as that is the real original

    values(); // Go ahead and call the function on initialization so you can see it instantly.
    function values(){
      lastData += 1 // always increment by 1 if it is always one. You may need to fit this better for your situation.
      $.ajax({
        type: "POST", // You had GET 
        url: "task.php",
        data: {ID: lastData}, // You did not have this
        success: function(data){
          $('#myFrame').html(data);
          // if you have a better way to return lastData then do that here, but you will need to use json to get a better splitting of data.
        }
      });

   }
   setInterval(values, 5000);
  })(jQuery);
</script>