Question

我正在创建一个网页，其中包含每个缩略图内的图像（一个缩略图中至少有3个图像）。我正在从数据库中检索这些图像。我的代码如下：

{foreach $rows as $row}
         <img src="{$row.item_picture}"/> 
    {/foreach}

但是，我想将这些图像存储在列表中，以便我可以使图像在缩略图内连续移动，如下所示：

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="C://Users//ts00333776//Desktop//theme.css">
        <script type="text/javascript">
            var rice= new Array() // create new array to preload images
            rice[0] = new Image() // create new instance of image object
            rice[0].src = "C://Users//ts00333776//Desktop//images//rice1.jpg" // set image src property to image path, preloading image in the process
            rice[1] = new Image()
            rice[1].src = "C://Users//ts00333776//Desktop//images//rice2.jpg"
            rice[2] = new Image()
            rice[2].src = "C://Users//ts00333776//Desktop//images//rice3.jpg"
        </script>
    </head>
    <body>
        <center>
        <table>
            <tr>
            <td class="first">
                <div class="second">
                    <div class="third">
                        <img src="C://Users//ts00333776//Desktop//images//rice1.jpg" id="slide" height="250px" width="250px"/>
                    </div>
                    <center><h4>some description</h4></center>
                </div>
            </td>
            </tr>
        </table>
        </center>
        <script type="text/javascript">
        //variable that will increment through the images
        var step=0

        function slideit(){
         //if browser does not support the image object, exit.
         if (!document.images)
          return
         document.getElementById('slide').src = rice[step].src
         if (step<2)
          step++
         else
          step=0
         //call function "slideit()" every 2.5 seconds
         setTimeout("slideit()",2500)
        }

        slideit()

        </script>
    </body>
</html>`

但是，在上面的代码中，我从本地检索图像，而不是从数据库检索图像。任何人都可以帮助我将图像存储在从phpmyadmin检索的列表中。这样我就可以在缩略图中移动图像了。如何移动从数据库中获取的缩略图内的图像？我会以正确的方式前进吗？任何帮助表示赞赏。

Answer 1

JavaScript无法直接连接到MySQL数据库;您需要使用服务器端脚本语言来至少从数据库中检索结果。然后，您可以使用该语言直接在页面中显示结果或将它们传递给JavaScript（例如，如果您正在执行自动填充文本字段，这会更有用，但如果您只是显示内嵌图像，则可能不太有用）。

在这种情况下，最常用的语言可能是PHP，但您可以在Python，Perl，Ruby，Java等中执行此操作。最大的决定因素可能是您的托管服务提供商为您提供的服务，紧随其后的是您更熟悉的语言。

如何使用javascript在缩略图内移动多个图像（从phpmyadmin检索）

1 个答案: