0

これが起こっているようには見えません!

$(".fancy").click(function(event) {
  event.preventDefault();
  var pic = [];
  $('.room-thumbnail').each(function(index) {
      pic.push('\'' + 'http://localhost' + $(this).attr('href') + '\'' );
  });

  var pics = '['+ pic.join(', ')+']';

  console.log(pics);
  // => ['http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-back.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-closeup1.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-closeup2.jpg']

  $.fancybox(pics, {
          'transitionIn'      : 'elastic',
          'transitionOut'     : 'elastic',
          'overlayColor'      : '#1D1D1D',
          'type'              : 'image',
          'cyclic': true
      });
});

href urls(pics)を手動で入力すると、機能します。しかし、fancyboxに変数(pics)を渡すと、fancyboxエラーが発生します:-要求されたコンテンツを読み込めません。-後でもう一度やり直してください。-

誰かが私が間違っていることを教えてもらえますか?

前もって感謝します。

4

2 に答える 2

1

コードに問題はありませんが、考慮していないことがあります。

あなたの宣言は、fancyboxが解析できない文字列var pics = '['+ pic.join(', ')+']';を返しています。

あなたがしなければならないことは、fancyboxがそれを解析できるようにそのような文字列をjavascriptに変換することです。objectそれを行うにはさまざまな方法があります。1つはeval()関数を使用していますが、セキュリティ上の問題がある可能性があるため、この方法はお勧めしません。

jQueryを使用しているため、最も安全な方法はjQuery.parseJSON(json)を使用することです。

...変数を設定した行の直後pics

var pics = '['+ pic.join(', ')+']';

これを追加してjsオブジェクトに変換します

pics = jQuery.parseJSON(pics);

それでうまくいくはずです。

于 2012-04-20T05:04:23.607 に答える
0

あなたはこれを行うことができます:

  1. displayプロパティがnoneに設定されたコンテナdivを作成します(display:none)
  2. このコンテナの内部にdeimgタグを配置します
  3. div内の任意の画像に対して関数triggerclickイベントを呼び出すと

例:

<div>
 <img ...></img ...></img ...>
</div>

jsコードの場合:$( "#container img")。fancybox();

function call_fancybox(){
$("#container img:first").trigger("click");
}
于 2012-04-19T21:40:07.457 に答える