使用javascript和php动态调用图像

Calling images dynamicly using javascript and php

本文关键字：调用 图像 动态 php javascript 使用      更新时间：2024-05-28

我是Javascript的新手，我已经创建了下面的代码，它工作得很好，没有问题，但我想知道什么是我想要使用php和Javascript从mysql数据库中动态提取图像，我如何重构下面的代码。提前感谢您的贡献。

var myimage = document.getelementById("mainImage");
var imageArray =["images/overlook.jpg","images/garden.jpg","images/park.jpg"];
var imageIndex =0;
function changeimage(){
      myimage.setAttribute("src",imageArray[imageIndex]);
      imageIndex++;
      if(imageIndex >= imageArray.length){
      imageIndex = 0;
}
setInterval(changeimage, 5000);

几个选项之一。

  1. 在数据库中查询具有图像URL的列。

    $query = mysql_query("SELECT url FROM images");

  2. 然后用这样的方法从中得到一个数组：

    $images = array();
while($row = mysql_fetch_array($query)){
    $images[] = $row['url'];
}

  3. 然后生成这个字符串（在提供的Javascript中使用）：

    var imageArray = ["images/overlook.jpg","images/garden.jpg","images/park.

    使用从数据库中检索到的数组。如果您不想在容易出错的字符串构建中遇到麻烦，可以在PHP中使用json_encode。

    $imagesAsJsonArray = json_encode($images);

  4. 回声，完成。

不是最优雅的解决方案。但它给了你一些可以玩的东西。在线查看一些PHP教程，您很快就会掌握窍门。

两种选择：

  1. 在创建页面时使用PHP，在页面中放置一组图像，并使用页面级javascript在它们之间循环
  2. 在页面中使用Ajax，从页面调用服务器以获取下一个图像，然后使用客户端javascript使返回的图像在页面上可见
相关文章：