2

これは非常に単純かもしれませんが、何が起こっているのかを見つけるのに苦労しています。

JS フィドル: http://jsfiddle.net/3hHAX/

「Open video modal」に出力されるリンクは 2 つあります。

リンク テキストが示すように、これらの 2 つのリンクは、YouTube ビデオが含まれているモデルのポップアップを開く必要があります。

これはhttp://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/の prettyphoto ライブラリを使用しています。

何らかの理由で、最初のクリックでクリック イベントがトリガーされません。しかし、2番目に動作します。

(CSS が含まれていないため、あまりモーダルに見えませんが、少なくともデモの目的で以下にコンテンツが読み込まれていることがわかります)。

誰が何が問題なのかを提案できますか?

ありがとう、

スティーブ

4

3 に答える 3

5

初期化後にクリック イベントをトリガーし、一度だけ初期化できるようにします。

(function($) {    
    $(".watch-this a, .field-name-field-embed-code a").live('click',function(){
        if (!$(this).is(".pPhoto")) {
            $(this).prettyPhoto({
                social_tools: ''
            }).addClass("pPhoto").click();     
        }
        return false;    
    });
})(jQuery);

デモ: http://jsfiddle.net/3hHAX/3/

明確化のために編集:
これは、動的要素でプラグインを初期化する非常に一般的な方法です。前述のように、要素が動的でない場合は、dom Ready で初期化することをお勧めします。

注：
.live減価償却されているため、実際に使用する必要があります.on

(function($) {    
    $(document).on("click",".watch-this a, .field-name-field-embed-code a",function(){
        if (!$(this).is(".pPhoto")) {
            $(this).prettyPhoto({
                social_tools: ''
            }).addClass("pPhoto").click();     
        }
        return false;    
    });
})(jQuery);
于 2012-04-02T21:41:55.370 に答える
1

みんなありがとう、

どちらの回答も、最終的に解決するのに役立ちました。

更新された JSFiddle でソリューションを終了します。

http://jsfiddle.net/3hHAX/6/

prettyPhoto はクリック イベントに独自のものをアタッチし、それらの dom 要素に適用する必要があるようです。

ありがとう、スティーブ

于 2012-04-03T12:53:57.617 に答える
0
  • まず第一に、DOM が本当に制御不能な状況以外では、jquery で live メソッドを決して使用しないでください。live 関数は多くの速度低下と多くの問題を引き起こすため、少なくともデリゲート関数を使用する必要があります (ただし、今回は問題はありませんでした)。
  • 第 2 に、クリック イベントはここで確認できるように発生しますが、prettyPhotos コンポーネントは理由が不明なため初回は動作しませんが、前の jsfiddle リンクでわかるように、初回はアラートで動作します。クリックすると、prettyphotos スクリプトのバグのように思えます (これは、Kevin B が 2 回目のクリック イベントをトリガーすることでハック的に解決しているようです)。
于 2012-04-02T21:56:20.317 に答える