如何在 Flask 中使用 AJAX 遍历列表

Question

问题我正在尝试在 Flask 中使用 AJAX 显示图像文件。更具体地说，我想在单击按钮后显示图像，并在再次单击按钮后显示下一张图像（如幻灯片）。图像的文件名存储在我的数据库中。我查询数据库以获取当前用户的文件名列表，并将每个文件名与路径的其余部分（图像存储在磁盘上的路径）组合以显示图像。到目前为止，我设法获得了当前用户的第一张图片。但是，我想不出一种方法来跟踪下一个要显示的图像。我尝试使用全局变量作为计数器 ( file_counter)，它应该用作索引。每次发出ajax请求以获取下一个文件时，我想将file_counter增加1，但计数器不会在后续调用时增加，也不会引发错误。问题我需要如何初始化全局变量 (file_counter) 以使其在多个调用中存储其值？此外，使用全局变量是这样做的正确方法吗？HTML<div id="ajax-field"></div><button class="btn btn-block"  id="next-button"><p>Next Image!</p></button>阿贾克斯：$('#next-button').click(function(){         $("#ajax-field").text("");         $.ajax({                        url: "/get_data",                        type: "POST",                        success: function(resp){                            $('#ajax-field').append(resp.data);                        }                    });                        });路由：global filenamesglobal [e-mail]("/get_data", methods=['POST'])def get_data():    try: # Is intended to fail on the first run in order for the global variables to be initialized. However it keeps failing on subsequent runs        display_img = filenames[file_count]        file_count +=1    except:        filenames = []        # current_user.uploads returns all file-objects of the current user        user_uploads = current_user.uploads        for file in user_uploads:            # file.filename returns the respective filename of the image            filenames.append(file.filename)        #filenames is now a list of filenames i.e. ['a.jpg','b.jpg','c.jpg'...]        display_img = filenames[0]        file_count = 1    path = "image_uploads/4_files/"+display_img    return jsonify({'data': render_template('ajax_template.html', mylist = path)})ajax_template.html：<ul>{% block content %}    <li>        <img id="selected-image-ajax" src="{{url_for('static',filename=mylist)}}"  class="img-thumbnail" style="display:block; margin:auto;"></img>    </li>{% endblock content %}</ul>