在页面显示事件中将图像数组从数据库加载到 jssor 滑块时出现问题

Question

我正在为数据库中的一组图像开发 JSSOR Slider。

是否有任何限制 "slides div" 必须至少有 1 div 到 initialize.As 我在我的 [=33= 上收到此错误] 当我启动应用程序时
另外，在页面显示时，我在滑块上只看到第一张图片，但无法滚动它，即使我同时启用了自动播放和手动滚动。

直到我有一堆滑块的静态图像时它工作正常但不适用于动态图像。我将所有图像作为 base64 字符串获取并显示它们。

/*inside pageshow for a page*/
var verticaltext = "";
var allItems = Tables.images.all();
var rating = [];
allItems.list(null, function (results)
 {
 results.forEach(function (r) {
 rating.push([r.capturedDate, r.name, r.ratingTreatment, r.ratingSkinCleansing, r.ratingPlucking, r.ratingView, r.ratingLastVal, r.capturedDate]);
            });
$.each(rating, function (key, value) {
console.log("record is " + value[1]);
verticaltext = verticaltext + "<div><img  src=" + value[1] +/"></div>"
           });
console.log("HTML" +verticaltext);
$('#abc').append(verticaltext);
            verticaltext = "";
        });

能否请您提供获取图像记录数组的来源，然后在页面上显示它应该在我的幻灯片 div 中填充图像列表 div。我试过了，我得到了 html 但我的页面显示在我的 html 完全形成之前就完成了

如有任何帮助，我们将不胜感激。

Answer 1

您可以填充图像列表，然后初始化 jssor 滑块。

确保在初始化 jssor 滑块之前填充幻灯片 html 代码。

例如，

//call the following method when the ajax call returns
function OnDataReady(data) {
    //analyze data and fill the <div u="slides' ...> element with correct html code

    //and then initialize jssor slider
    var options = {...};
    var jssor_slider1 = new $JssorSlider$(options);
}

回复 1：是的，必须至少有 1 个幻灯片才能使滑块工作

回复2：你的代码一定有错误。

在页面显示事件中将图像数组从数据库加载到 jssor 滑块时出现问题

Issue in loading array of images from database into jssor slider on Page show event

javascript

database

dynamic

slider

jssor