如何显示来自 mysql 数据库的图像幻灯片
How to display a slideshow of images from a mysql database
我有一个名为images
的表,字段id, name, photo
,photo
字段varchar
,因为图片使用php表单存储到服务器上。目前我的代码仅显示表中的 1 张图像,请有人帮助我,以便它使用查询对所有图像进行幻灯片放映:
SELECT * FROM images WHERE name='$pagetitle'
$pagetitle
在脚本中的其他位置定义。
问题出在索引.php文件中
索引.php
<!-- Image Slide Show Start -->
<div style="display: flex; justify-content: center;">
<img align="middle" src="" name="slide" border=0 width=300 height=375>
<?php
require('mysqli.php');
$data = $conn->query("SELECT * FROM images WHERE name= '$pagetitle'");
$image = mysqli_fetch_array( $data );
$directory = ("/images/".$image['photo'] . "");
$conn->close();
?>
<script>
//configure the paths of the images, plus corresponding target links
slideshowimages("<?php echo $directory ?>")
//configure the speed of the slideshow, in miliseconds
var slideshowspeed=2000
var whichlink=0
var whichimage=0
function slideit(){
if (!document.images)
return
document.images.slide.src=slideimages[whichimage].src
whichlink=whichimage
if (whichimage<slideimages.length-1)
whichimage++
else
whichimage=0
setTimeout("slideit()",slideshowspeed)
}
slideit()
</script> </div><br><br>
<!-- Image Slide Show End -->
解析的代码如下:
<?php
// Connect to the database
require('mysqli.php');
// Query for a list of all existing files
$sql = "SELECT * FROM images WHERE name= '$pagetitle'";
$result = $conn->query($sql);
$directory = '';
while( $image = $result->fetch_assoc() )
$directory .= ($directory != '' ? "," : '') . ('"/images/'.$image["photo"] . '"');
// Check if it was successfull
if($directory != '') {
// if there are images for this page, run the javascript
?><script>
//configure the paths of the images, plus corresponding target links
slideshowimages(<?php print $directory ?>)
//configure the speed of the slideshow, in miliseconds
var slideshowspeed=2000
var whichlink=0
var whichimage=0
function slideit(){
if (!document.images)
return
document.images.slide.src=slideimages[whichimage].src
whichlink=whichimage
if (whichimage<slideimages.length-1)
whichimage++
else
whichimage=0
setTimeout("slideit()",slideshowspeed)
}
slideit()
</script>
<?
} else {
// If there are not any images for this page, leave the space blank
echo "";
}
// Close the mysql connection
$conn->close();
?>
<?php
$servername = "";
$username = "";
$password = "";
$dbname = "";
$conn = new mysqli($servername, $username, $password, $dbname);
//Make connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
//SQL query
$sql = "SELECT * FROM TABLE_NAME";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$dir= "" . $row["field"]. "";
echo" <div class='content section' style='max-width:500px'>
<img class='slides' src='$dir' style=width:100%></div>";
}
} else {
echo "Empty Gallery";
}
?>
<html>
<body>
<script>
var index = 0;
slideshow();
function slideshow() {
var i;
var x = document.getElementsByClassName("slides");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
index++;
if (index > x.length) {index = 1}
x[index-1].style.display = "block";
setTimeout(slideshow, 3000); // Change slides every 3 seconds
}
</script>
</body>
</html>
相关文章:
- 将地理编码结果转换为php变量以发布到mysql数据库
- 从MySQL数据库中获取输入数据需要两次页面刷新
- 在php和mysql中选择选项.一旦选择了选项,就列出我的sql数据库数据
- 如何使用PHP将javascript变量添加到mysql数据库中
- 在javascript中跳过周六和周日,并向mysql数据库中添加不重复的条目
- 当select标记触发onChange事件时,从mysql数据库加载html表
- 如何使用mysql数据库在node.js中登录API
- 如何比较两个MySql数据库
- 使用node-js上传文件,并将表单信息存储在数据库(mysql)中
- 我应该如何使用node.js和导出来调用mysql数据库
- 输入框值将保存到 MySQL 数据库
- 实时接收来自服务器的消息(数据库-MySQL,前端-Angularjs)
- 如何在不刷新页面的情况下从数据库(mysql)加载更新的数据
- 显示数据库 MySQL 描述字段中的 125 个单词
- 如何将HTML表行拖放到另一个位置(在Jsp中)并将新位置(值)也保存在数据库(MySql)中
- 从数据库mysql中检索数据不起作用
- 将数据库mysql中的文件图像插入excel
- 谷歌地图v3->数据库/mysql->AJAX->LOOP->AJAX->环
- 如何使用javascript与数据库mysql创建数组
- 选择下拉值从数据库mysql中获取填充数据