weixin_33736649 2015-12-10 14:32 采纳率: 0%
浏览 235

Fancybox中的两个关闭事件

I'm facing problem with my popup ajax contact form because it have only one close event...

My AJAX contact form have two buttons SEND and CANCEL. When i use SEND button the Sweet alert confirmation show correct message. But when i close the window by button CANCEL or click outside the window or use X button on the corner the same confirmation message is showing and this is problem

My js code

           $('#button').fancybox({
            'hideOnContentClick': false,
            'afterClose' : function(){
                swal({
                    title: 'Thanks dude!',
                    text: 'You are awesome!',
                    type: 'success',
                    showConfirmButton: false,
                    timer: '5000'
                });
            }
            });

My ajax call

                $.ajax({
                    url: "ajax_form.php",
                    post: "POST",
                    data: $('#contact').serialize(),
                    dataType: "json"
                });     $.fancybox.close();

So when someone hit SEND button $.fancybox.close(); will close the window and Sweet Alert give nice info with great success. How to add or disable Sweet Alert confirmation when someone use CANCEL button or use other close action?

  • 写回答

1条回答 默认 最新

  • weixin_33725272 2015-12-10 15:00
    关注

    Thinking in another way to close it, you can try adding a common class or something to the CANCEL, X button and the parent element outside the fancybox. Then with jQuery (or JS), you can define a function that closes it and avoid the ajax call. For example, add a common class class="preventAjax". Then with jQuery:

    $('.preventAjax').click(function() {$.fancybox.close();});
    

    Other than that, you can close it with Css, but I recommend closing it with the commands that the API provides.

    Hope that helps!

    评论

报告相同问题?

悬赏问题

  • ¥30 Matlab打开默认名称带有/的光谱数据
  • ¥50 easyExcel模板 动态单元格合并列
  • ¥15 res.rows如何取值使用
  • ¥15 在odoo17开发环境中,怎么实现库存管理系统,或独立模块设计与AGV小车对接?开发方面应如何设计和开发?请详细解释MES或WMS在与AGV小车对接时需完成的设计和开发
  • ¥15 CSP算法实现EEG特征提取,哪一步错了?
  • ¥15 游戏盾如何溯源服务器真实ip?需要30个字。后面的字是凑数的
  • ¥15 vue3前端取消收藏的不会引用collectId
  • ¥15 delphi7 HMAC_SHA256方式加密
  • ¥15 关于#qt#的问题:我想实现qcustomplot完成坐标轴
  • ¥15 下列c语言代码为何输出了多余的空格