1

我有一个漫画网站，它遍历数据库中的所有图像并将它们显示为缩略图。用户可以单击其中一张图像，在 viewComic.php 模板上以正常大小查看它。

我想让用户按左右箭头来导航图像。

所以，我的想法是：

  1. pagination.php 通过遍历数据库结果数组来处理正确页面上的图像显示（通过偏移）。用户可以单击结果（如下）以转到 viewcomic.php 模板上的特定图像。

    '<br />IMG: <a href="./templates/viewcomic.php?id=' . $row['imgid'] . '&image=' . $imgpath.$row['imgname'] . '">

  2. 现在在 viewcomic.php 上，我得到了 id 和图像，并显示了图像

    $imgid = $_GET['id']; 
$imgpath = $_GET['image']; 
<center><img src=".<?php echo  $imgpath  ?>" /></center>

用户可以按左右箭头来浏览图像...我的目标是以某种方式增加图像 ID 以移动到下一个图像，但这似乎不起作用...

    <script type="text/javascript">
        $(document).ready(function() { 
            $(document).keydown(function (e) {
                if (e.which == 39) { //get next image           
                <?php 
                    $count = 0;
                    $count++;
                    echo "<img src=" . $imageArray[$count] . "/>";
                ?> 
                }
            });
        });
    </script>

有任何想法吗？

编辑：我将通过从 pagination.php 传入的图像数组。

所以，在我的 viewcomic.php 文件中，我更新了我的 jquery 脚本（见上文）.. 但 jquery 似乎不喜欢嵌入式 php，即使它都在一个 php 文件中。

这是页面源代码与代码的图片：

页面来源

4

3 回答 3

1

怎么样：

$(document).ready(function() { 
 $(document).keydown(function (e) {
    if (e.which == 39) { 
       var nextId = $_GET['id'] + 1;
       window.location = "./templates/viewcomic.php?id=" + nextId;
    }
 });
});
于 2012-10-11T18:29:10.547 回答
1

这是我要做的：

假设图像路径被引号包围：

echo $imageArray[0]; // 'imagepath/image'

脚本：

<script type="text/javascript">
var imgArray = [<?php echo implode(',',$imageArray) ?>];
// now the image array have the list of all your images. 

$(document).ready(function() {
   var img = document.getElementById("theImage");
   imgIndex = 0;
   $(document).keydown(function (e) {
      if (e.which == 39) { //get next image           
         img.src = imgArray[imgIndex++]
      }

      ... /* Logic to check if at the end of imageArray */ ...
   });
});
</script>

的HTML：

<center><img src="" id="theImage"/></center>
于 2012-10-11T20:48:18.650 回答
0

在这种情况下，您的页面会在每次请求时提交，您也可以在客户端站点处理此问题。

单击链接查看有关使用 JavaScript 旋转链接的演示。:使用 javascript 链接旋转

于 2012-10-11T18:52:33.427 回答