尝试在表单提交时加载 Fancybox 灯箱中的异地页面

发布于 2024-11-18 08:48:01 字数 1448 浏览 7 评论 0原文

我正在尝试在提交邮件列表注册表单时加载灯箱(通过 Fancybox)。提交表单时,注册表单操作会加载指向 Constant Contact 的站外链接。通常,此页面会在标准弹出窗口中加载,效果很好。

但是,由于人们经常屏蔽弹出窗口,因此我们尝试用灯箱来装饰它。

所以这就是问题:当我提交表单时,它会加载灯箱,但不会加载灯箱中的页面。我怀疑这是因为它没有将信息传递到 iframe/lightbox,而且很可能是因为我没有正确设置它。我希望有人能提供帮助,因为我还不太精通 jquery。我什至可能不需要使用 iframe,我不确定。

我确实找到了对通过ajax传递信息的引用,但我不太清楚如何有效。我还发现了类似的帖子,但目前还不清楚他们是如何解决的。

这是我的代码,也许你可以帮忙? :) 我会很感激。

$(document).ready(function() {

    $("#iframe").fancybox({
        'hideOnContentClick': true,
        'transitionIn'  :   'fade',
        'transitionOut' :   'fade',
        'speedIn'       :   600, 
        'speedOut'      :   200, 
        'overlayShow'   :   true,
    });


});

表格如下:

<form name="ccoptin" id="signup" action="http://visitor.r20.constantcontact.com/d.jsp" target="_blank" method="post">
<input type="hidden" name="llr" value="yyyyyy">
<input type="hidden" name="m" value="xxxxxx">
<input type="hidden" name="p" value="oi">
<label>sign up for new services and promotions:</label>
<input type="text"name="ea" value="" class="text" /> <input type="submit" id="iframe" class="submit" name="go" value="submit" />
</form>

感谢您的意见,请耐心等待,因为我是 jquery/ajax 的新手。

谢谢你!

I'm attempting to load a lightbox (via Fancybox) on submission of a mailing list sign-up form. The sign-up form action loads an off-site link to Constant Contact when a form is submitted. Normally, this page is loaded in a standard pop-up, which does work just fine.

But, because folks often have pop-ups blocked, we're trying to spiff it up with a lightbox.

So here's the rub: when I submit the form, it loads the lightbox, but won't load the page in the lightbox. I suspect this is because it's not passing the information through to the iframe/lightbox and it's likely because I don't have it set up properly. I'm hoping someone can help, as I'm not totally that versed in jquery yet. I may not even need to use iframe, I'm not sure.

I did find this reference to passing the information via ajax, but I'm not totally clear on how that works. I also found this similar post, but it's not really clear how they resolved it.

Here is my code, perhaps you can help? :) I'd appreciate it.

$(document).ready(function() {

    $("#iframe").fancybox({
        'hideOnContentClick': true,
        'transitionIn'  :   'fade',
        'transitionOut' :   'fade',
        'speedIn'       :   600, 
        'speedOut'      :   200, 
        'overlayShow'   :   true,
    });


});

Here is the form:

<form name="ccoptin" id="signup" action="http://visitor.r20.constantcontact.com/d.jsp" target="_blank" method="post">
<input type="hidden" name="llr" value="yyyyyy">
<input type="hidden" name="m" value="xxxxxx">
<input type="hidden" name="p" value="oi">
<label>sign up for new services and promotions:</label>
<input type="text"name="ea" value="" class="text" /> <input type="submit" id="iframe" class="submit" name="go" value="submit" />
</form>

I appreciate your input and please bear with me, as I am a relative jquery/ajax newb.

Thank you!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文