【问题标题】:On submit open lightbox. If lightbox closed, submit form. If link clicked, do not submit在提交打开灯箱。如果灯箱关闭,请提交表单。如果链接被点击,请勿提交
【发布时间】:2013-01-21 13:16:29
【问题描述】:

我有一个类似于以下内容的 HTML 表单:

<form id="cart-form">
    <input type="text" name="quantity" />
    <input type="hidden" name="sku" value="SKU123" />
    <input type="submit" name="submit" value="Submit" />
</form>

我也有一个像这样的隐藏 div:

<div id="cart-special-offers" style="display:none;"><p>Would you like to take a look at our <a href="/catalogue/category/543" class="ignore-form">current promotions</a>?</p>
    <p><a href="/catalogue/category/543" class="ignore-form">Yes please</a></p>
    <p><a href="#" class="fancybox-close-link">No thanks</a></p>
</div>

提交表单时,我想在花式框弹出窗口中显示隐藏的 div(停止表单提交)。

如果用户选择查看特价商品,表单提交应该完全取消,用户应该被重定向。

如果用户选择关闭fancybox弹出窗口(以任何方式),用户的表单应该现在被提交。

我目前拥有的JS是:

$('#cart-form').submit(function(){
    $.fancybox.open([
        {
            href : '#cart-special-offers'
        }
    ]);


    return false;

});

$('.fancybox-close-link').click(function(){
    $.fancybox.close();
    $('#cart-form').submit();
});

这显然会导致一个循环,每次我尝试关闭它而不查看特别优惠时都会显示fancybox窗口。

如何阻止这种情况发生?

提前致谢。

【问题讨论】:

  • 哎呀,-1 有点苛刻?我本想得到答案,但想了一个小时后意识到这是一个愚蠢的想法……

标签: javascript jquery forms fancybox fancybox-2


【解决方案1】:

试试这样的

$('#cart-form').submit(function (e)
{
  $.fancybox.open([
    {
        href : '#cart-special-offers'
    }
  ]);
  return !!e.submit;
});

$('.fancybox-close-link').click(function(){
   $.fancybox.close();
   $('#cart-form').submit({
        submit: true
     });
 });

【讨论】:

  • 这确实会阻止它循环,但不幸的是,在单击 .fancybox-close-link 按钮时没有为我提交表单(虽然它确实关闭了fancybox)
  • 这也应该提交表单...单击关闭按钮时
  • 抱歉浪费了您的时间。我意识到我正在以完全错误的方式去做我正在做的事情,而我试图做的事情(这里解释得很糟糕)实际上是不可能的。
【解决方案2】:

这实际上是一种荒谬的处理方式。

我想要发布并转到一个页面,但我有两个提交按钮。

我没有意识到我可以隐藏其中一个提交按钮(显示:无),在其位置放置一个触发灯箱的锚点,然后在单击灯箱上的关闭时触发对隐藏的单击输入。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-08-09
    • 2023-03-26
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多