0

我有一个小提琴：

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

警报在 show start 和 show over 和 close 时触发，但绑定到按钮单击让我望而却步。

我有一个可以工作的fancybox 弹出窗口。这是一个表格：

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>

触发fancybox的链接：

<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 放在一个地方，并使用现有的 fancyBox 技术引用它。

然而，我并没有完全放弃。我一直在摆弄它，并找到了使用 iFrame 的解决方案。不确定我到底做了什么，但我制定了原始计划，并使用了脚本：

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

现在警报框会在 iFrame fancyBox 中弹出。

The thing is with this solution is: it may be limited to the same domain I'm on, so in production it probably wont work. I ran a quick test and it seems to work cross domain but I have a feeling it'll cause me trouble in the future...

于 2013-01-04T20:04:09.067 回答