使用jQuery + PHP添加项目

Append items using jQuery + PHP

本文关键字：添加 项目 PHP jQuery 使用      更新时间：2023-09-26

在下面的代码中，我使用PHP代码调用一些图像。

注意:我使用了"Advanced Custom Fields"for Wordpress

<?php
// check if the repeater field has rows of data
if( have_rows('upload-masonry') ):
 $i = 0;
    // loop through the rows of data
    while ( have_rows('upload-masonry') ) : the_row('5');
            $i++;
            if( $i > 9 )
            {
                break;
            }
?>             
     <span><img src="<?php the_sub_field('image');?>"></span>          
 <?
    endwhile;
else :
    // no rows found
endif;
?>

每次调用将显示9个图像，现在我想再添加9个。但由于我不太擅长jQuery，我不知道如何实现它。以前有人做过吗，可以帮我解决这个问题吗?

$(document).ready(function(){
  $("#btn2").click(function(){
    $("#grid").append("<span><img src='<?php the_sub_field('image');?>'></span>");
  });
});

不要在JS脚本中放入PHP代码。在点击btn2时，您需要对包含您想要加载的"下一组"图像的页面进行ajax调用。您可以使用.append()通过在dom中附加父元素来将它们添加到现有图像之后。在显示图像的PHP页面上，您可以包含下一个'next' bt2n，该bt2n可以包含一个偏移量参数，以便在每次单击时加载'next set'。

所以你的阅读将是…

http://api.jquery.com/jquery.ajax/

http://api.jquery.com/append/

如果你正在使用Wordpress，你可能会找到一个插件与你正在寻找的功能。

相关文章：