繁体   English   中英

从jquery ajax请求输出html

[英]output html from jquery ajax request

我正在创建从目录加载的图库。 首先,我为目录中的每个相册文件夹创建了一个div标签。 然后即时通讯使用jquery ajax获取被单击的文件夹名称,并为该文件夹中的每个图像创建div标签。 我将文件夹的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>';
            }}?>

拿着它

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

并做到这一点

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

首先,如下更改您的success功能:

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

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM