output html from jquery ajax request


output html from jquery ajax request

我正在创建一个从目录加载的图库。 首先,IM 为目录中的每个相册文件夹创建一个div 标签。 然后,IM 使用 jQuery Ajax 获取单击的文件夹名称,并为该文件夹中的每个图像创建div 标记。 IM 将文件夹的 ID 发送到外部 PHP 页面以获取图像的文件路径。 我不确定如何输出实际的 HTML。 相当Ajax/PHP 编码的新手,因此解释很有帮助。

jquery ajax:

var jq=$.noConflict();
        jq(document).ready(function(){
        jq(".album-select").click(function(event){
        var id=event.target.id;
        jq.ajax({
        type: "POST",
        url: "image_loader.php",
        data: {phpid:id},
        success: function(data){
            jq('#mydiv').html("");
            jq('#mydiv').append(data);
        }           

    });

image_loader.php

<?php
if (isset($_POST['phpid'])) {
$album_fill = $_POST['phpid'];
}
$dir = 'images';
$slash = '/';
$dir_image = "$dir$slash$album_fill";
    $dir_contents = scandir($dir_image);
    foreach($dir_contents as $file){
        if($file !== '.' && $file !== '..'){
        $dir_imagepath = "$dir_image$slash$file";
            echo '<div style="position:absolute; width:100px; height:100px; top:1100px; left:500px;">';
            echo '<img src="',$dir_imagepath,'">';
            echo '</div>';
            }}?>
首先按

如下方式更改success函数:

   success: function(data){
        $('#mydiv').html(data);
    }

其次,确保您的ajax调用返回HTML页面。

拿这个

jq('#mydiv').html("");
jq('#mydiv').append(data);

并让它成为这个

jq('#mydiv').html(data);