如何在 flexslider 中更改图像？答案

【问题标题】：How to change images in flexslider?如何在 flexslider 中更改图像？
【发布时间】：2022-11-20 06:57:10
【问题描述】：

我知道这是一个非常基本的问题，但它让我很困惑——我找不到太多关于 flexslider 的文档。另外，我对这种语言很陌生，我是 C++/ASM 类型的人，但正在尝试设置网页。该页面适用于互联网广播电台。滑块用于显示当前播放、下一张和以后专辑的专辑封面。图片名称在滑块中“硬编码”，如果图片不需要更改，这很好。问题是图像每 3 分钟更改一次，但浏览器会缓存它们，因此即使图像文件内容发生更改，也会显示旧图像数据。

我在过去几周开发了一个 Windows 服务，它从 SQL 数据库（除其他外）更新实际图像文件（Playing.jpg、Next.jpg 等），只是为了在滑块初始化后发现，显示的图像不要改变。

无论如何，滑块是否仅用于“静态”图像？关于如何动态更新图像的任何建议？ PHP/JS？

<li> <img src="Playing.jpg" alt="" >
   <div class="flex-caption">
      <h2>Now Playing</h2>
   </div>
</li>

谢谢！

保持文件名相同但更改图像内容没有区别。动态更改滑块图像的一般方法是什么？代码 sn-ps 将不胜感激。

【问题讨论】：

标签： javascript html css flexslider

【解决方案1】：

为了避免浏览器缓存，您可以添加这样的随机查询：

PHP:

<li> <img src="Playing.jpg?v=<?php echo rand(); ?>" alt="" >
   <div class="flex-caption">
      <h2>Now Playing</h2>
   </div>
</li>

记者：

<li> <img src="Playing.jpg" alt="" id="imageid">
   <div class="flex-caption">
      <h2>Now Playing</h2>
   </div>
</li>
<script>
document.getElementById("imageid").src="Playing.jpg?v="+Math.random();
</script>

【讨论】：