2017-03-03 2 views
0

Das Ding ist meine 2 Warnung funktioniert gut, aber nicht meine Funktion! Es funktioniert perfekt auf Chrome und Firefox, aber in Safari mein ShowLoading() nicht angezeigtSafari jquery onSubmit funktioniert nicht

<form onsubmit="alert('lol');ShowLoading(); alert('bla'); return true;" method="post" class="std" enctype="multipart/form-data"> 

Meine Funktion:

function ShowLoading() { 

var loading_screen = pleaseWait({ 
logo: "logoloader.png", 
backgroundColor: 'rgba(23, 22, 22, 0.94)', 
loadingHtml: "" 
}); 
} 

ich please-wait.js verwenden: http://pathgather.github.io/please-wait/

* @version 0.0.5 
*/ 
!function(a,b){"object"==typeof exports?b(exports):"function"==typeof define&&define.amd?define(["exports"],b):b(a)}(this,function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q;g=document.createElement("fakeelement"),e=!1,n=!1,d="animationend",m=null,f="Webkit Moz O ms".split(" "),l={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"};for(h in l)if(o=l[h],null!=g.style[h]){m=o,n=!0;break}if(null!=g.style.animationName&&(e=!0),!e)for(p=0,q=f.length;q>p;p++)if(i=f[p],null!=g.style[""+i+"AnimationName"]){switch(i){case"Webkit":d="webkitAnimationEnd";break;case"Moz":d="animationend";break;case"O":d="oanimationend";break;case"ms":d="MSAnimationEnd"}e=!0;break}return c=function(a,b){return b.classList?b.classList.add(a):b.className+=" "+a},k=function(a,b){return b.classList?b.classList.remove(a):b.className=b.className.replace(a,"").trim()},b=function(){function a(a){var b,f,g,h;b=this.constructor._defaultOptions,this.options={},this.loaded=!1,this.finishing=!1;for(f in b)h=b[f],this.options[f]=null!=a[f]?a[f]:h;this._loadingElem=document.createElement("div"),this._loadingHtmlToDisplay=[],this._loadingElem.className="pg-loading-screen",null!=this.options.backgroundColor&&(this._loadingElem.style.backgroundColor=this.options.backgroundColor),this._loadingElem.innerHTML=this.options.template,this._loadingHtmlElem=this._loadingElem.getElementsByClassName("pg-loading-html")[0],null!=this._loadingHtmlElem&&(this._loadingHtmlElem.innerHTML=this.options.loadingHtml),this._readyToShowLoadingHtml=!1,this._logoElem=this._loadingElem.getElementsByClassName("pg-loading-logo")[0],null!=this._logoElem&&(this._logoElem.src=this.options.logo),k("pg-loaded",document.body),c("pg-loading",document.body),document.body.appendChild(this._loadingElem),c("pg-loading",this._loadingElem),this._onLoadedCallback=this.options.onLoadedCallback,g=function(a){return function(b){return a.loaded=!0,a._readyToShowLoadingHtml=!0,c("pg-loaded",a._loadingHtmlElem),e&&a._loadingHtmlElem.removeEventListener(d,g),a._loadingHtmlToDisplay.length>0&&a._changeLoadingHtml(),a.finishing?(null!=b&&b.stopPropagation(),a._finish()):void 0}}(this),null!=this._loadingHtmlElem&&(e?this._loadingHtmlElem.addEventListener(d,g):g(),this._loadingHtmlListener=function(a){return function(){return a._readyToShowLoadingHtml=!0,k("pg-loading",a._loadingHtmlElem),n&&a._loadingHtmlElem.removeEventListener(m,a._loadingHtmlListener),a._loadingHtmlToDisplay.length>0?a._changeLoadingHtml():void 0}}(this),this._removingHtmlListener=function(a){return function(){return a._loadingHtmlElem.innerHTML=a._loadingHtmlToDisplay.shift(),k("pg-removing",a._loadingHtmlElem),c("pg-loading",a._loadingHtmlElem),n?(a._loadingHtmlElem.removeEventListener(m,a._removingHtmlListener),a._loadingHtmlElem.addEventListener(m,a._loadingHtmlListener)):a._loadingHtmlListener()}}(this))}return a._defaultOptions={backgroundColor:null,logo:null,loadingHtml:null,template:"<div class='pg-loading-inner'>\n <div class='pg-loading-center-outer'>\n <div class='pg-loading-center-middle'>\n  <h1 class='pg-loading-logo-header'>\n  <img class='pg-loading-logo'></img>\n  </h1>\n  <div class='pg-loading-html'>\n  </div>\n </div>\n </div>\n</div>",onLoadedCallback:null},a.prototype.finish=function(a,b){return null==a&&(a=!1),window.document.hidden&&(a=!0),this.finishing=!0,null!=b&&this.updateOption("onLoadedCallback",b),this.loaded||a?this._finish(a):void 0},a.prototype.updateOption=function(a,b){switch(a){case"backgroundColor":return this._loadingElem.style.backgroundColor=b;case"logo":return this._logoElem.src=b;case"loadingHtml":return this.updateLoadingHtml(b);case"onLoadedCallback":return this._onLoadedCallback=b;default:throw new Error("Unknown option '"+a+"'")}},a.prototype.updateOptions=function(a){var b,c,d;null==a&&(a={}),d=[];for(b in a)c=a[b],d.push(this.updateOption(b,c));return d},a.prototype.updateLoadingHtml=function(a,b){if(null==b&&(b=!1),null==this._loadingHtmlElem)throw new Error("The loading template does not have an element of class 'pg-loading-html'");return b?(this._loadingHtmlToDisplay=[a],this._readyToShowLoadingHtml=!0):this._loadingHtmlToDisplay.push(a),this._readyToShowLoadingHtml?this._changeLoadingHtml():void 0},a.prototype._changeLoadingHtml=function(){return this._readyToShowLoadingHtml=!1,this._loadingHtmlElem.removeEventListener(m,this._loadingHtmlListener),this._loadingHtmlElem.removeEventListener(m,this._removingHtmlListener),k("pg-loading",this._loadingHtmlElem),k("pg-removing",this._loadingHtmlElem),n?(c("pg-removing",this._loadingHtmlElem),this._loadingHtmlElem.addEventListener(m,this._removingHtmlListener)):this._removingHtmlListener()},a.prototype._finish=function(a){var b;return null==a&&(a=!1),null!=this._loadingElem?(c("pg-loaded",document.body),"function"==typeof this._onLoadedCallback&&this._onLoadedCallback.apply(this),b=function(a){return function(){return document.body.removeChild(a._loadingElem),k("pg-loading",document.body),e&&a._loadingElem.removeEventListener(d,b),a._loadingElem=null}}(this),!a&&e?(c("pg-loaded",this._loadingElem),this._loadingElem.addEventListener(d,b)):b()):void 0},a}(),j=function(a){return null==a&&(a={}),new b(a)},a.pleaseWait=j,j}); 
+0

versuchen, es an den Kopf zu bewegen und Javascript vor dem Funktionsaufruf hinzugefügt. –

+0

Ich habe nicht auch gearbeitet! es ist wie Safari nur Anzeige Warnung, versuchte ich mit einem einfach hinzufügen CSS und es funktioniert nicht auch, was kann ich tun – psppro26

+0

Ich lese auch auf einen anderen Beitrag, dass Sie etwas wie "javascript: ShowLoading();" anstatt nur "ShowLoading();" . Sie sind nicht der einzige, der dieses Verhalten hat, es ist ziemlich einfach, Post im Internet zu finden, der Ihnen eine Antwort geben kann. Schau einfach, was die Leute schon gemacht haben. –

Antwort

1

Lassen Sie uns versuchen Sie etwas Neues dann:

<script> 
     function ShowLoading() { 
     var loading_screen = pleaseWait({ 
      logo: "logoloader.png", 
      backgroundColor: 'rgba(23, 22, 22, 0.94)', 
      loadingHtml: "" 
     }); 
     } 
     $('#test').click(function() { 
      alert('click!'); 
      ShowLoading(); 
      $('#target').submit(); 
     }); 
    </script> 
<form id="target" method="post" class="std" enctype="multipart/form-data"> 
<div id="test">test</div> 
</form> 

Dies geschieht vor der eigentlichen Einreichung. Es sollte in allen Browsern funktionieren. Ich habe meinen Code nicht getestet, wie ich sage, es ist nur ein anderer Weg, es zu tun.

+0

aufgerufen werden, was ich anziehen sollte (Ereignis). ? Die Sache ist, wenn ich .submit() auf meinem Formular die Seite laden wie das Formular gesendet wird, aber es ist nur eine Aktualisierung? – psppro26

+0

sehen aus wie Ihr Postprozess, ohne Ihre Funktion auszuführen. Fügen Sie einen einfachen Button hinzu, der Ihre Funktion aufruft und den Beitrag abschickt? –

+0

Ich versuchte, aber wenn ich .submit() auf meinem Formular wie hier verwenden: $ ("#target") .submit() die Seite neu laden wie das Formular gesendet wird, aber es ist nur eine Aktualisierung Ich weiß nicht warum? – psppro26

Verwandte Themen