Laden von GIF auf dem normalen Formular Absenden

Ich weiß nicht, ob dies ist möglich, weil nach meinem Konzept ist es nicht.Sagen, ich habe ein Formular:

<form action="/loadLotsOfRecords" method="get">
<input type="text" name="email" />
<input type="submit />
</form>

Nun diese form dauert mindestens 10-15 Sekunden zu laden, weil offensichtlich es gibt viele Aufzeichnung. Ich weiß, mit AJAX kann ich das laden von GIF und laden Sie die Aufzeichnungen. Aber gibt es eine Möglichkeit, in dem ohne Verwendung von AJAX kann ich einfach nur ein GIF in den 15 Sekunden, wenn die Seite geladen wird. Wenn ich windows verwenden.load-Funktion, es dreht sich nur auf der nächsten Seite. Was ich verlangen, ist stattdessen der browser laden möchte ich eine gleichzeitige loader auf meinem Körper. Dank

  • Die schnelle Antwort ist... Nein. Das problem ist, dass, wenn Sie ein Formular Absenden/navigieren zu einer neuen Seite, Sie haben keine Kontrolle über die Seite nicht mehr. Der browser ist dann warten auf Antwort vom server. Bis das passiert, müssen Sie warten, und lassen Sie den browser tun es ist Sache.
InformationsquelleAutor Aditya Singh | 2016-07-06
  1. 8

    Müssen Sie einfach zeigen Sie loader-gif auf das erfolgreiche senden des Formulars. Auf diese Weise, das laden von gif auf der Seite angezeigt wird, und behält die Anzeige, bis die Seite umgeleitet auf der nächsten Seite nach der Bearbeitung. Sie kümmern sich nicht über das ausblenden von dem laden es sei denn, Sie erwarten, dass alle Fehler im Formular. Sie sollte zeigen, diese Lader, nur beim Formular erfolgreich gesendet wurde.

    JS:

    $(document).ready(function(){
  $("#myform").on("submit", function(){
    $("#pageloader").fadeIn();
  });//submit
});//document ready

    CSS:

    #pageloader
{
  background: rgba( 255, 255, 255, 0.8 );
  display: none;
  height: 100%;
  position: fixed;
  width: 100%;
  z-index: 9999;
}

#pageloader img
{
  left: 50%;
  margin-left: -32px;
  margin-top: -32px;
  position: absolute;
  top: 50%;
}

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div id="pageloader">
   <img src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.16.1/images/loader-large.gif" alt="processing..." />
</div>

<form id="myform">
  <input type="text" name="fname" id="fname" value="" />
  <input type="submit" value="Submit" />
</form>

    • Naja, viele (die meisten) Browsern tatsächlich aufhört, gif-Animationen usw. wenn es anfängt zu navigieren zu einer neuen Seite. Ja, sicher, es könnte arbeiten in bestimmten Situationen, aber im Allgemeinen, es ist nicht wirklich ein Lösung.
    • Sie haben einen Punkt dort. Aber ich habe es ein paar mal und es funktionierte. Könnte ich nicht überprüfen, in allen Browsern.
    • ...und ich verwenden, um es zu tun und gestoppt werden, weil Sie nur selten gearbeitet. 🙂
    • Ich glaube, Sie haben Recht, denn letztes mal habe ich versucht über mozilla hat es nicht funktioniert vielleicht, was Sie sagte, ist der Grund,
    • Danke @MagnusEriksson. Ich werde auch aufhören mit diesem dann 😉
    • Vielen Dank, es hat funktioniert 🙂

    InformationsquelleAutor Mohit Bhardwaj
Schreibe einen Kommentar