16

ロードするページがあり、ロード後に LI のリストを取得してニュース フィードに入力します。

<li><a href="/url/" class="quickview">quick view</a></li>
<li><a href="/url/" class="quickview">quick view</a></li>
<li><a href="/url/" class="quickview">quick view</a></li>

ユーザーがクイックビューをクリックしたときに派手なボックスをトリガーしようとしていますが、運がありませんでした。何か案は？

$(document).ready(function() {
    $('.quickview').fancybox();
});

も試しました：

$(document).ready(function() {
   $('a.quickview').live('click', function() {
        $(this).fancybox();
    });
});

http://fancybox.net/

アイデアをありがとう...

4

5 に答える 5

30

古い質問ですが、将来の検索者に役立つかもしれません。

私の推奨する解決策は、ライブ イベント内から手動で fancybox を起動することです。

$('.lightbox').live('click', function() {
    $this = $(this);
    $.fancybox({
        height: '100%',
        href: $this.attr('href'),
        type: 'iframe',
        width: '100%'
    });
    return false;
});

編集: jQuery 1.7 から live() は廃止され、代わりに on() を使用する必要があります。詳細については、 http://api.jquery.com/live/を参照してください。

于 2011-10-12T13:56:27.727 に答える
23

これは、すべての ajax リクエストの後に機能するはずです

$(document).ajaxStop(function() { 
    $("#whatever").fancybox();
});
于 2011-02-17T15:08:38.510 に答える
11

問題は、fancyboxをAJAXがロードされた要素にアタッチすることですよね？

私は同じ問題を抱えていて、この解決策を見つけました。

ここにコピーして貼り付けます。詳細については、元のバグレポートを参照してください。

$.fn.fancybox = function(options) {

$(this)
  .die('click.fb')
  .live('click.fb', function(e) {       
    $(this).data('fancybox', $.extend({}, options, ($.metadata ? $(this).metadata() : {})))
    e.preventDefault();
    [...]

クレジットはjeff.granに送られます。

于 2010-09-07T00:04:01.373 に答える
4

.onが推奨されるようになったため、委任されたイベントに関するドキュメントを.live読んだ後、私が思いついた解決策を次に示します (要素に「trigger-modal」のクラスがあると仮定します)。

$(document).on('click', '.trigger-modal', function() {
  // remove the class to ensure this will only run once
  $(this).removeClass('trigger-modal');
  // now attach fancybox and click to open it
  $(this).fancybox().click();
  // prevent default action
  return false;
});
于 2013-02-11T23:01:32.693 に答える
2

Fancyboxについての私の理解では、 simpleを呼び出すとfancybox()、選択した要素にプラグインがアタッチされます。イベントを呼び出しfancyboxてclickも何も開かれません。

追加するだけでいいと思います

$(li_element_that_you_create).fancybox();

LIリストに新しい要素を作成するコードに

編集

を使用している場合はload、次のようにします。

$('#ul_id_goes_here').load('source/of/news.feed', function() {
  $('.quickview').fancybox();
});
于 2010-03-28T16:07:30.187 に答える