J'ai un problème étrange avec Safari dans une superposition n'ayant pas afficher correctement la soumission du formulaire.
Que devrait-il arriver est lorsque le bouton Soumettre sur le formulaire est cliqué, la superposition apparaît sur le formulaire.
Que ce qui se passe est que rien n'apparaît (bien qu'il semble que quelque chose soit comme je ne puis que je ne puisse plus cliquer sur ledit bouton). Voici le code JavaScript qui exécute le formulaire doit être soumis. P> .loading {
background: rgba(#999, 0.9);
bottom: -10px;
display: none;
left: -20px;
position: absolute;
right: -20px;
top: -10px;
.text {
color: #fff;
font-size: 26px;
font-weight: 700;
left: 0;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
}
}
4 Réponses :
pense que vous avez un autre problème. Êtes-vous sûr que la superposition Je pense que cela ne le pointe pas.
Juste faire un test. Mettez Dans ce cas, vous pouvez être sûr que
Oui, j'ai vérifié cela et c'est défini correctement. J'ai fait une console.Log de cela aussi du testMessage modifié à autre chose. Donc, ce n'est pas ça .... var est au bon moment de pointer vos éléments? Ou est-ce indéfini?
TestMessage sur votre HTML et il suffit d'ajouter / remplacer l'innerhtml sur votre fonction.
superposition = jQuery ('. Formulaire principal .charger'); est valide.
1 commentaires
vérifié dans Safari / Windows et ça marche bien. Je suppose que le problème était arrière-plan: rgba (# 999,0.9) code>.
Vous pouvez vérifier en interchangeant des commentaires pour ces lignes dans CSS- /*background: rgba(#999, 0.9);*/
background: rgba(158,158,158,0.9);
Ce n'est pas ça désolé. Je pense que c'est parce que dans votre violon, le e.preventdefault (); empêche l'action par défaut du formulaire. Nous voulons que l'action dudit formulaire se produise ainsi que la superposition.
Je peux voir la superposition même dans Safari / Windows. Quel est le problème exact ici?
Désolé, oui le vôtre fonctionne. Le problème est que nous avons besoin que le bouton appuie sur le bouton pour fonctionner. Donc, l'appliquer à notre solution montre la superposition, mais l'action du formulaire ne fonctionne pas (les différents scripts PHP fonctionnant sur la soumission du formulaire, ne fonctionnent pas). J'espère que c'est une clarification. Désolé je ne l'ai pas mentionné.
C'est-à-dire parce que e.preventdefault () est ajouté dans le gestionnaire de soumission. Commentaire qui ligne et essayez.
De ce que je me souviens que Safari bloquera des trucs de dessin une fois qu'il commence à charger une page. Avez-vous essayé d'empêcher la soumission, de faire vos affaires et de simplement soumettre?
Quelque chose comme ça pourrait fonctionner: p>
function main_form_overlay() {
var form_outer = jQuery('.main-form'),
form = jQuery('.main-form form'),
html,
overlay;
html = '<div class="loading"><span class="text">Checking 77 Destinations, please Be Patient <i class="fa fa-circle-o-notch fa-spin"></i></span></div>';
form_outer.append(html);
overlay = jQuery('.main-form .loading');
form.on('submit', function(event){
//Prevent the form from submitting
var e = event || window.event;
e.preventDefault();
console.log("In Here!");
if (!overlay.is(':visible')) {
overlay.show();
console.log("Show Overlay");
} else {
overlay.hide();
console.log("Hide Overlay");
}
//Submit the form now
$(this).submit();
});
}
C'est un itinéraire que j'ai pensé, le problème est que cela provoque une boucle, comme une fois que vous vous soumettez en bas à $ (ceci) .Submit () , puis le formulaire ("Soumettre ' fonctionne à nouveau. S'il y avait un moyen de le courir une fois, j'aimerais l'entendre! :)
Eh bien, je suggérerais peut-être définir un auditeur "Cliquez sur" sur le bouton FORM, empêchant ainsi la défaillance de la valeur et soumettez le formulaire via $ ('# form_id'). Soumettre (); ?
Afret, j'ai réussi à résoudre ce problème, et @Peterthelobster est arrivé le plus proche.
En bref, en attachant à l'auditeur "Cliquez", nous avons ensuite E.PreventDefault (); La forme, garantissant que la superposition était affichée en retardant la soumission du formulaire de 1 seconde.
Avez-vous essayé avec
z-index ?Je l'ai essayé avec un z-index de 2000000 sur la classe de chargement. Toujours pas de joie.
Qu'est-ce qui tire la soumission du formulaire? Essayez d'ajouter d'abord la superposition, puis soumettez le formulaire.
La superposition s'affiche (si je retirez l'affichage: aucun; il s'affiche). De plus, le journal de la console affiche "Afficher la superposition", lorsque le formulaire est soumis (également "Masquer la superposition" si l'affichage: Aucun; n'est pas présent). Ça ne se réfléchisse tout simplement pas sur le site principal ...
Stackoverflow.com/q/36547476/5200704