fermer facile boîte de fantaisie pop et montrer le message réussi comme alerte en utilisant le formulaire de contact 7

Question

J'utilise le plugin de boîte facile fantaisie pour montrer le formulaire de contact 7 dans la fenêtre et sur les données de soumission réussies.Je ferme la pop-up en utilisant on_sent_ok: "$.fancybox.close();", En addition paramètres de formulaire de contact 7, maintenant je dois afficher popup de message réussi sur fermer, j'ai essayé "$.fancybox.close();alert('sucess');" mais cela donnera boîte d'alerte d'abord que la fermeture de la boîte d'alerte le popup va également fermer, quelqu'un peut m'aider s'il vous plaît pour afficher une boîte d'alerte à la fin de la boîte de fantaisie?

Je suis nouveau sur JavaScript et WordPress.

Voici mon html et 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 ci-dessous

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

Answer 1

passer l'option OnClosed à la fonction fancybox.

-à-dire:

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

Mise à jour

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