javascript - FancyBox プラグインが機能しない

Question

ファンシーボックスに問題があります。リンクをクリックすると、ファンシーボックスはコンテンツを取得しますが、ライトボックスを表示せず、返されたコンテンツを Ajax 経由で取得するはずのページにジャンプします。

HTML :

<a class="butt red medium fancybox" href="http://localhost/food/index.php/food/ajaxExtras?foodId=412">سفارش </a>

JS:

$("a.fancybox").fancybox();

私の結果： ここに画像の説明を入力

score 0 · Accepted Answer

あなたの写真から、ファンシーボックスのプラグインファイルを追加していないと言えます。

jquery fancy box plugins のリンクは次のとおりです。ヘッダータグの間に追加するだけです。

js/fancybox-1.3.4/jquery.easing-1.3.pack.js

js/fancybox-1.3.4/jquery.mousewheel-3.0.4.pack.js

score 0 · Accepted Answer

外部ページを開いている場合は、次のような API オプションを使用してtypeofを設定する必要がある場合があります。content

$("a.fancybox").fancybox({
    type: "ajax" // or "iframe"
});

data-fancybox-typeまたは、リンクでHTML5 属性を使用する

<a data-fancybox-type="ajax" class="butt red medium fancybox" href="http://localhost/food/index.php/food/ajaxExtras?foodId=412">سفارش </a>

ほとんどの ajax 呼び出しはサーバー環境でテストする必要があり、localhost では機能しない可能性があることに注意してください。

また、fancybox スクリプトコードを.ready()メソッド内にラップしていることを確認してください。

2 に答える 2