schließen easy fancy box pop und zeigen erfolgreiche Nachricht als Warnung mit Kontaktformular 7

Question

Ich benutze easy fancy box plugin um Kontaktformular 7 im Popup-Fenster und beim erfolgreichen Einreichen von Daten zu zeigen.Ich schließe das Popup mit on_sent_ok: "$.fancybox.close();", In zusätzlichen Einstellungen von Kontaktformular 7, jetzt muss ich Popup von erfolgreichen Nachricht am Ende zeigen, versuchte ich "$.fancybox.close();alert('sucess');", aber dies wird geben Alarmbox zuerst als Schließen Alarmbox das Popup wird auch schließen, kann jemand bitte mir helfen, eine Alarmbox zu zeigen am Ende der schicken Box?

Ich bin neu in JavaScript und WordPress.

Hier ist meine HTML und 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 unten

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

Answer 1

Geben Sie die OnClosed Option zum fancybox Funktion.

dh:

<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'); 
     }) 
    }); 

Aktualisiert

<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>