关闭容易花哨的框流行，并显示成功的消息作为警报使用联系表格7。

Question

我使用简单的花哨盒插件在弹出窗口和成功提交数据时显示联系人表单7。我正在使用on_sent_ok: "$.fancybox.close();"关闭弹出窗口，在联系人表7的附加设置中，现在我需要在关闭时显示成功消息的弹出，我尝试了"$.fancybox.close();alert('sucess');"，但这将首先给出警告框，而不是关闭警告框，弹出窗口也会关闭，有人能帮我显示一个提示框吗？

我是JavaScript和WordPress的新手。

这是我的html和javascript

<div class="mdl-layout__content text-center" style="background: url('<?=$dynamic_images[4]['full']; ?>');color:<?php the_field('text_color');?>;background-size: cover; background-position:center;">
        <div class="mdl-grid">
            <div class="mdl-typography--text-center mdl-cell mdl-cell--12-col mdl-cell--middle">
                <?php the_field('demo'); ?>

                    <a href="#contact_form_pop" class="fancybox">
                        <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent prod-button3 prod-btn">Contact Us</button>
                    </a>
                    <div style="display:none" class="fancybox-hidden">
                        <div class="fancy-main-container">
                            <div id="contact_form_pop" class="slate_contact">
                                <?php echo do_shortcode('[contact-form-7 id="1579" title="Slate Form"]'); ?>
                            </div>
                        </div>
                    </div>
            </div>
        </div>
    </div>

下面的Javascript

<script>
  $("#test").fancybox({
  onClosed: function () {
  alert('sucess');
  })
    });
 </script>

Answer 1

将onClosed选项传递给fancybox函数。

即：

    <a id="example1" href="http://farm6.staticflickr.com/5614/15602332537_bae1aaccd8_b.jpg">
        <img alt="example1" src="http://farm6.staticflickr.com/5614/15602332537_bae1aaccd8_m.jpg">
    </a>
    $("#example1").fancybox({
      onClosed: function() {
       alert('sucess');
      })
    });

更新的

<div class="mdl-layout__content text-center" style="background: url('<?=$dynamic_images[4]['full']; ?>');color:<?php the_field('text_color');?>;background-size: cover; background-position:center;">
        <div class="mdl-grid">
            <div class="mdl-typography--text-center mdl-cell mdl-cell--12-col mdl-cell--middle">
                <?php the_field('demo'); ?>

                    <a href="#contact_form_pop" id="test">
                        <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent prod-button3 prod-btn">Contact Us</button>
                    </a>
                    <div style="display:none" class="fancybox-hidden">
                        <div class="fancy-main-container">
                            <div id="contact_form_pop" class="slate_contact">
                                <?php echo do_shortcode('[contact-form-7 id="1579" title="Slate Form"]'); ?>
                            </div>
                        </div>
                    </div>
            </div>
        </div>
    </div>