3

動的に作成された画像のスライド ショーを作成しようとしています。画像へのディレクトリ パスは ajax 呼び出しからの応答として返され、再び別の ajax 呼び出しが行われ、スライドショーの html 構造が作成され、html に追加する応答として返されます。

現在、スライド ショーの作成にResponsiveSlide.jsを使用しています。すべてが正常に機能し、適切な画像パスが含まれているため、html 応答の戻り値も検証されます (URL から個別に画像を読み込むことで検証しました) が、何らかの理由でスライドショーが発生せず、画像が 1 つしか表示されません。

JS は次のとおりです。

$(function() {
   $("#slider1").responsiveSlides({
        maxwidth: 1000,
        speed: 800
      });
});

HTML コードは次のとおりです。

<ul class="rslides" id="slider1"></ul>

返される応答は次のとおりです。

<li><img src="resources/images/Screenshots/Booking/Final.jpg"></li>
<li><img src="resources/images/Screenshots/Booking/0AFinal.jpg"></li>
<li><img src="resources/images/Screenshots/Booking/0BFinal.jpg"></li>

この応答を HTML ul 要素に追加する JS コードは次のとおりです。

$.ajax({

            url: "/prismweb/results?directoryPath="+response,
            success: function (data) {
                $("#loading").hide();   //to hide the loading icon after ajax is completed
                $("#slider1").append(data);
            }
        });

JS と CSS が追加されました:

    <script type="text/javascript" src="resources/js/jquery-2.1.4.min.js </script>

   <script type="text/javascript" src="resources/js/responsiveslides.min.js"></script>

デバッグ中に Web 要素を調べると、すべての画像がコンソールに表示され、すべての画像が表示されますが、最初の li 画像のみが表示され、スライドショーは発生しません。誰かがここで何が悪いのか教えてもらえますか? それを行う他の方法はありますか？

4

1 に答える 1

0

以下のように「maxwidth」や「speed」などのパラメーターに二重コロンを追加します..ありがとう

$(function() {
   $("#slider1").responsiveSlides({
        "maxwidth": 1000,
        "speed": 800
      });
});
于 2016-01-13T10:24:58.577 に答える