Popup Après La Soumission. Afficher une fenêtre de chargement ou s'il vous plaît attendre

Voici mon script:

<form action='' method='' onsubmit='refreshpage();'>
<input name='refresh' type="image" SRC="images/Next-Page-Button.gif" HEIGHT="60" WIDTH="173" BORDER="0" value='Refresh'>
</form>

Je veux que quand l'utilisateur clique sur le bouton "page suivante" un chargement ou s'il vous plaît attendre pop up parce que ça prend plus de 30 sec pour la page suivante et je veux que les membres de connaître le site de travail, mais aussi faire de la popup s'en aller après le chargement de la page.

Aussi, si vous voulez voir le bouton dans l'action de mon site est www.socialmedianetworkexchange.com et c'est lorsque vous cliquez sur le bouton "gagner facebook j'aime" bouton.

Pourquoi êtes-vous de l'actualisation de la page lorsque vous pouvez simplement utiliser AJAX pour envoyer le formulaire?
Il doit envoyer l'info à la base de données et obtenir plus de sites sur "j'aime"
Oh, bien AJAX fait la même chose, mais pas de rafraîchir la page 😉 Il s'agit essentiellement de la soumission du formulaire, mais sans actualisation de la page. Voir ma réponse ci-dessous pour le chargement de la chose. 🙂
comment puis-je utiliser de l'ajax?
Voir jQuery AJAX. $.post et $.get est plus facile à utiliser si vous avez l'intention d'utiliser un certain type de méthode, voir ces liens: jQuery $.get ou jQuery $.post

OriginalL'auteur Tahoe Cale | 2011-11-26

  1. 10

    Vous pourriez montrer un élément sur la page lorsqu'ils cliquent sur elle, et puis elle s'en ira d'elle-même (une fois qu'il va à la nouvelle page). Voici un code que j'ai fait:

    JavaScript:

    function showLoading() {
    document.getElementById('loadingmsg').style.display = 'block';
    document.getElementById('loadingover').style.display = 'block';
}

    HTML/CSS:

    <style type="text/css">
      #loadingmsg {
      color: black;
      background: #fff; 
      padding: 10px;
      position: fixed;
      top: 50%;
      left: 50%;
      z-index: 100;
      margin-right: -25%;
      margin-bottom: -25%;
      }
      #loadingover {
      background: black;
      z-index: 99;
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
      filter: alpha(opacity=80);
      -moz-opacity: 0.8;
      -khtml-opacity: 0.8;
      opacity: 0.8;
    }
</style>

<div id='loadingmsg' style='display: none;'>Redirecting, please wait...</div>
<div id='loadingover' style='display: none;'></div>
<form action='' method='post' onsubmit='refreshpage();showLoading();'> 
<input name='refresh' type="image" src="images/Next-Page-Button.gif" height="60" width="173" border="0" value='Refresh'> 
</form>

    Vous pouvez modifier le message de chargement de ce que tu veux dire, bien sûr.

    J'espère que cette aide. Laissez-moi savoir si vous avez des questions.

    Edit:

    Il suffit d'ajouter le onclick événement à la <li> comme:

    <li onclick="showLoader();">
<a href="facebook.php">
<img src="images/logos/facebooklikeicon.png" height="25" border="0" /> Earn Coins Facebook 
</a>
</li>

    Assurez-vous que vous avez les autres HTML, CSS et JavaScript pour la fonction de travail.

    S'il vous plaît laissez-moi savoir si il y a des pièces que vous ne comprenez pas.

    Comment pourrais-je faire l' >Redirection en cours, veuillez patienter...< dans une image animée
    Vous pouvez juste obtenir un chargement GIF à partir de AjaxLoad, ils ont beaucoup de différents types de chargement des icônes. Il suffit d'utiliser une <img /> dans le div à côté de la "Redirection en cours, veuillez patienter..." du texte.
    J'ai donc ce bouton comment puis-je faire la même chose
    <li><a href="facebook.php"><img src="images/logos/facebooklikeicon.png" height="25" border="0" /> Gagner des Pièces Facebook</a></li>
    Voir mon édité réponse ci-dessus...

    OriginalL'auteur Nathan