0

私はフィドルを持っています:

http://jsfiddle.net/nicorellius/4vQ9S/

アラートはショーの開始時、ショーの終了時、および終了時に発生しますが、ボタンのクリックへのバインドは私を避けています。

ファンシーボックスのポップアップが機能します。それはフォームです:

HTML は単純な表です。

<form id="my-form" method="post" action="">
    <table>
        <tr>
            <td>
                <label for="name">Name</label></td>
                <input type="text" id="name" name="name">
            </td>
            <td>
                <input type="submit" value="Submit">
            </td>
        </tr>
    </table>
</form>

ファンシーボックスをトリガーするリンク:

<a class="fancy-popup" href="test.html" data-fancybox-type="iframe">

いくつかの関数を呼び出す簡単なスクリプトがあります。

$(document).ready(function() {

    function before_show() {
        alert("fancybox before show");
    }

    function after_show() {
        alert("fancybox after show");
    }

    function on_close() {
        alert("fancybox after close");
    }

    function alert_me() {
        $.fancybox.inner.find('iframe').contents().find('input.click-me').click(function() {
            alert("fancybox has been foiled!!!");
        });
    }

    $(".fancy-popup").fancybox({
        openSpeed     :    'slow',
        openEffect    :    'fade',
        minWidth      :    '200',
        minHeight     :    '100',
        maxWidth      :    '400',
        maxHeight     :    '150',
        scrolling     :    'no',
        beforeShow    :    before_show,
        afterShow     :    after_show,
        afterClose    :    on_close,
        //afterShow     :    alert_me
    });
});

同じオリジンポリシーのため、iFrame 内でこれを行うことができないことに気付きました。これを機能させる方法は一生わかりません。

ノート

質問は当初から変更されているため、検証に関する以下の回答は適用されないことに注意してください。

4

1 に答える 1

0

苦労の末、iFrame を使用せずにこれを作り直すことにしました。iFrame が最善の方法だと思っていましたが、少なくとも現在の理解レベルでは、それが間違っていることに気付きました。ただし、このメソッドを使用すると、fancyBox ポップアップからアラートを正常に呼び出すことができます。

http://jsfiddle.net/nicorellius/d4KVs/

ここでも既存の検証を使用できると思います。

変更された HTML は次のとおりです。

<a href="#test" class="fancy-popup">fancy link</a>

HTML を 1 か所に配置し、既存の fancyBox 手法を使用して参照しました。

それでも諦めませんでした。私はそれをいじり続け、iFrameを使用して解決策を見つけました。何をしたか正確にはわかりませんが、元の計画を立て、スクリプトを使用しました。

    function alert_me() {
        $.fancybox.inner.find('iframe').contents().find(
            'input.click-me').click(function() {
                alert("fancybox has been foiled!!!");
        });
    }

これで、アラート ボックスが iFrame fancyBox 内にポップアップ表示されます。

問題は、このソリューションです。私が使用しているのと同じドメインに限定されている可能性があるため、本番環境ではおそらく機能しません。簡単なテストを実行したところ、クロスドメインで動作しているようですが、将来的に問題が発生する気がします...

于 2013-01-04T20:04:09.067 に答える