Javascript 从ajax捕获数据并使用它进行操作的最佳方法

我正在制作一个应用程序，它应该使用ajax从数据库中获取图像，然后使用一些旋转木马插件显示图像。以下是它应该如何工作：

图像url从管理员保存到数据库

前端脚本对php文件进行ajax调用，并从db返回所有url

现在，当我有了所有的图像，旋转木马插件可以应用

图像现在正在一个接一个地显示

诀窍是，我想在显示最后一个图像时进行另一个ajax调用，并用数据库中的新图像重新填充容器div。这是我的密码

function get_images(){
var data = {
    "function_name" : "get_images",
    "args" : ""
};

$.ajax({
    type : "POST",
    url : "http://localhost/.../functions.php",
    data : data,
    dataType : "JSON",
    success : function(ret){
        $(".container").html(ret);
        $(".container").carousel(//When last call - function again);

    }
});
}

---

这就是问题所在。在ajax上，成功的carousel插件开始旋转img，完成后，应该再次调用get_images函数。但是这个函数已经在另一个函数中了，每次调用时都会更深一层。有什么方法可以做到这一点吗？

最好是旋转木马启动一个需要更多图像的事件，并收听该事件。然后，您可以检索更多图像并将新列表返回到旋转木马。有一些carousel插件具有所有这些内置功能。我经常使用这个：

可能在您的PHP脚本中：

<?php
    if ( isset($_POST['function_name']) ) {
        if ( $_POST['function_name'] == 'get_images' ) {
            // Get some URLs into an array...
            // For the sake of the example we'll manually fill the array
            $urls = ['img/image1.png', 'img/image2.png'];
            echo json_encode($urls);
        }
    }

function Carousel() {
    this.getMoreImages();
}

Carousel.prototype.nextImage = function () {
    if (this.i < this.images.length) {
        this.showImage(); // Implement this.
        this.i += 1;
        this.spin():
    }
    else {
        this.getMoreImages();
    }
}

Carousel.prototype.spin = function () {
    var self = this;
    setTimeout(function () {
        self.nextImage();
    }, 5000);
}

Carousel.prototype.getMoreImages = function () {
    var self = this;
    $.ajax({
        type : 'POST',
        url : 'http://localhost/.../functions.php',
        data : data,
        dataType : 'JSON',
        success : function (ret) {
            self.images = JSON.parse(ret);
            self.i = 0;
            self.spin();
        }
    });
}

var myCarousel = new Carousel();