0

Javascriptフォトビューアプラグイン（ここ-> http://www.photoswipe.com/）を使用しています。ユーザーが画像をスワイプしたときに、プラグが接続されている写真を動的に更新したい。

画像要素を解析するphpスクリプトへのajax呼び出しの結果に基づいて、そのプロパティを更新する役割を担うJavascriptオブジェクト（Jooseフレームワークを使用）があります。

これが私のコードです：

<script>
    (function(window, PhotoSwipe){

        domInjector = new DOMInjector();
        domInjector.init();

        document.addEventListener('DOMContentLoaded', function(){

            var options = {
                 preventHide: true,
                 getImageSource: function(obj)
                 {
                    return obj.url;
                 },

                 getImageCaption: function(obj)
                 {
                    return obj.caption;
                 }
            },

            instance = PhotoSwipe.attach(
            [
                domInjector.output
            ], 

            options 

            );

            instance.show(0);

    }, false);


}(window, window.Code.PhotoSwipe));

domInjector.outputは次のようになります->{url：'"+ this.masterObject.elementArray [1] .imageLink +"'、caption：'Image 001'}

ここで、this.masterObject.elementArray[1].imageLinkは画像のURLです。

しかし...ajax関数がdomInjector.outputを完了するのに有限の時間がかかるため、出力は数秒間空であり、画像スワイププラグインには要素がありません！

私のコードの残りの部分は問題なく、すべて正常に機能しています。ajax関数が完了したら、更新されたdomInjector.outputをどのように挿入できるかわかりません。

申し訳ありませんが、これを説明するのは非常に困難です。どんな助けでも素晴らしいでしょう。

4

1 に答える 1

1

イベントのハンドラー内でPhotoSwipeプラグインをインスタンス化する代わりにdocument.DOMContentLoaded、Ajax呼び出しが正常に戻ったら、DOMInjectorクラスから発生するイベントのハンドラーでインスタンス化する必要があると思います。コールバック関数をパラメーターとしてDOMInjectorクラスに渡し、Ajax呼び出しが戻ったときにそれを実行することも検討できます。いずれにせよ、PhotoSwipeをインスタンス化すると、その呼び出しの出力が利用可能になります。

于 2012-05-09T23:35:27.520 に答える