dregvw1801 2014-06-16 06:43
浏览 70
已采纳

php：从文件夹中的图片制作数组并交替显示它们？

The following code is supposed to make an array from pictures found in a directory that end in .png using php, then allow buttons to change the pointer on the array and allow the page to display the current picture that the pointer is on. This doesnt seem to be working at all. Am I doing this correctly?

<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
img {float:left; }
</style>
</head>
<body>
<?PHP
$pages = array ();
$dirname = "assets/pictures/";
$images = glob($dirname."*.png");
foreach($images as $image) {
$pages[] = $image;
}
?>
<?PHP
echo '<img src="'.current($pages).'" class="photo"/>';
function shownext() {
$mode = next($pages);
}
function showprev() {
$mode = prev($pages);
}
function showfirst() {
$mode = reset($pages);
}
function showlast() {
$mode = end($pages);
}
?>
<a href="" onclick="showfirst()">first</a>
<a href="" onclick="showprev()">previous</a>
<a href="" onclick="shownext()">next</a>
<a href="" onclick="showlast()">last</a>
</body>
</html>
  • 写回答

4条回答 默认 最新

  • dqj29136 2014-06-16 07:12
    关注

    You cant directly put your php functions on onclick="" events. Alternatively, if you want to use jQuery, you could use $.ajax to request the values on PHP. From there, after you got the image paths, manipulate the next, prev, first, last on the client side. Consider this example:

    <?php

if(isset($_POST['getimages'])) {
    $dirname = "assets/pictures/";
    $images = glob($dirname."*.png");
    // collect the images
    foreach($images as $image) {
        $pages[] = $image;
    }
    echo json_encode($pages);
    exit;
}

?>

<img src="" alt="" id="images" width="200" height="200" />
<br/>
<a href="#" class="navigate" id="first">First</a>
<a href="#" class="navigate" id="previous">Previous</a>
<a href="#" class="navigate" id="next">Next</a>
<a href="#" class="navigate" id="last">Last</a>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    var current_pointer = 0;
    var images = [];

    $.ajax({
        url: 'index.php', // call the php file that will process it, i just used this in the same page
        type: 'POST',
        dataType: 'JSON',
        data: {getimages: true},
        success: function(response) {
            // after a successful response from PHP
            // use that data and create your own array in javascript
            images = response;
            $('#images').attr('src', images[current_pointer]);

        }
    });

    // simple pointer to navigate the array you got from PHP
    $('a.navigate').on('click', function(){

        var current_val = $(this).attr('id');
        switch(current_val) {
            case 'first':
                current_pointer = 0;
            break;
            case 'last':
                current_pointer = images.length-1;
            break;
            case 'next':
                current_pointer = (current_pointer >= images.length-1) ? images.length-1 : current_pointer+1;
            break;
            case 'previous':
                current_pointer = (current_pointer < 0) ? 0 : current_pointer-1;
            break;
        }

        $('#images').attr('src', images[current_pointer]);
    });

});
</script>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题？

悬赏问题

  • ¥15 C++ 头文件/宏冲突问题解决
  • ¥15 用comsol模拟大气湍流通过底部加热（温度不同）的腔体
  • ¥50 安卓adb backup备份子用户应用数据失败
  • ¥20 有人能用聚类分析帮我分析一下文本内容嘛
  • ¥15 请问Lammps做复合材料拉伸模拟，应力应变曲线问题
  • ¥30 python代码，帮调试
  • ¥15 #MATLAB仿真#车辆换道路径规划
  • ¥15 java 操作 elasticsearch 8.1 实现 索引的重建
  • ¥15 数据可视化Python
  • ¥15 要给毕业设计添加扫码登录的功能！！有偿