JSSOR Slider中的空幻灯片和goto-currentIndex属性在javascript中不起作用的问题

issue with empty slide in JSSOR Slider and goto currentIndex property not working in javascript

本文关键字：javascript 不起作用 属性 问题 Slider 幻灯片 JSSOR goto-currentIndex      更新时间：2023-11-18

嗨，我正在研究JSSOR SLider，并试图从数据库加载一组图像。

我可以将其他图像加载到滑块上，但我得到的第一张幻灯片是空幻灯片，其余的都很好。

在我的index.html 中

<div data-role="main" id="galleryItemMainDetails">
    <!--blue-->
    <div id="MasterTemplate" style="min-width: 300px; min-height: 330px; background: #6699FF;">
        <!--purple-->
        <div id="slider1_container" style="position: relative; top: 0px; left: 5px; width: 270px; height: 260px; background: #990099; overflow: hidden; ">
            <!-- Slides Container -->
            <!--light green-->
            <div id="HomeImgSliders" u="slides" style="cursor: move; position: relative; overflow: hidden; left: 5px; top: 5px; width: 250px; height: 250px; background: #99FF99;">
                <div id="HomeSlides"></div>
            </div>
        </div>
    </div>
</div>

在我的js文件中

$('#galleryItem').on('pageshow', function () {
    var verticaltext = "";
    if ($('#galleryItem').has('#HomeImgSliders').length) {
        $("#HomeImgSliders").append("");
    }
    var allItems = Tables.images.all().order("capturedYear", false).order("capturedMonth", false).order("capturedDate", false);

    allItems.list(null, function (results) {
        var verticaltext = "";
        results.forEach(function (r) {
            // alert(JSON.stringify(r));
            imageDetailsarr.push([r.capturedDate, r.name, r.ratingTreatment, r.ratingSkinCleansing, r.ratingPlucking, r.ratingView, r.ratingLastVal, r.capturedDate, r.capturedMonth, r.capturedYear]);
            //  console.log("record is " + r.name);
            verticaltext = verticaltext + "<div><img alt='Image not found' src=" + r.name + " class='vSlideImg'/></div>"
            // <div><img  src=" + value[1] "></div>

        });
        $("#HomeImgSliders").append(verticaltext);
        // $("#HomeSlides").append(verticaltext);
        sliderDataReady(verticaltext);
 });

});

我如何才能摆脱这个空的图像，出现在第一张幻灯片

2） 此外，我如何根据每次更改的整数值将滑块设置为特定的幻灯片图像。我尝试了GoTO/slideIndex/currentIndex属性，但无法获得它？

如果有任何帮助，我们将不胜感激？感谢

Re1:请转储'verticaltext'的值，使用它可以创建一个静态滑块来查看为什么有空幻灯片。

Re2:请使用$StartIndex选项

var options = {
    ...,
    $StartIndex: 0,    //specify slide index to display at the beginning.
    ...
};
相关文章：