如何使用ajax mysql php检索数据加载多个div

时间:2012-01-02 07:28:29

标签: php jquery ajax

我在MySQL中有多个图像路径。通过$ .ajax我正在检索路径,但它会显示在一个div中,我想在一个div中放置一个图像路径...如果检索到25个图像路径,则可以创建25个div,每个div填充一个检索到的路径。简而言之,n个图像的n个div。

以下是jQuery代码之后的php代码:

$family = mysql_real_escape_string($_REQUEST['send_txt'], $link);
$query = "SELECT imgurl FROM images WHERE family='$family'";


$result = mysql_query($query, $link);

echo "<table>";
if(mysql_num_rows($result) > 0){

    while($row = mysql_fetch_array($result)){
        echo "<tr><td>".$row['imgurl']."</td></tr>";
                }
}else{
    echo "<tr><td>No results matching family \"$family\"</td></tr>";
}
echo "</table>";

jQuery代码

$(document).ready(function() {
    $('ul.sub_menu a').click(function() {
        var txt = $(this).text();  
        $.ajax({
            type: 'POST',
            url: 'thegamer.php',
            data: {send_txt: txt},
            success: function( data ){

//现在如何将数据分配给jquery对象并通过循环检索图像路径 //在为每个图像路径创建新div时逐个插入

 $('#sliderid').html( data );

            }               
        });
    });
});

2 个答案:

答案 0 :(得分:3)

更好地使用Jquery模板,很容易解决您的问题。获取JSON数据并绑定到您的jquery模板。

答案 1 :(得分:0)

<script type="text/javascript">
$(document).ready(function() {
    $('ul.sub_menu a').click(function() {
        var txt = $(this).text();  
        $.ajax({
            type: 'POST',
            url: 'thegamer.php',
            data: {send_txt: txt},
            success: function( data ){

            var response=JSON.parse(data);

                $.each(response, function(index, item){

                $('#sliderid').append($("<div></div>").text(item));

                });
        }
    });
}); }); </script>

您所要做的就是迭代您收到的数据,并在每次迭代时创建一个包含您追加到容器元素的URL的div。

我还注意到你忘了添加echo jason_encode(array_of_data_to_be_send)以便发回数据。 (你不会发回任何东西)。

还要确保将其作为数组发送(对于此代码段)。