使用javascript / jquery将图像从php添加到文档中

Question

    <?php
$imgDir =   'images/';
$images =   glob($imgDir . '*.{jpg,jpeg,png,gif}',GLOB_BRACE);
echo json_encode($images);  
?>

<script>
jQuery(function(){
    var phpvar  =   '<?php echo json_encode($images) ?>';
        jQuery('body').append('<img src="' + phpvar + '"/>');
    });
</script>

The top php scans the folder 'images' and echoes all the file pathnames. However i want to use the array formed from this and append it to the document/body to display the images using . But i'm not sure how to pass the php variable '$images' to jquery/javascript

Answer 1

The phpvar that you're creating is actually an array (provided you remove the quotes), so you need to loop through this array and add each image separately, like this:

jQuery(function(){
    var phpvar = <?php echo json_encode($images) ?>;
    $.each(phpvar, function(id, image){
        jQuery('body').append('<img src="' + image + '"/>');
    });
});