Comment faire pour fermer automatiquement le fichier d'amorce de dialogue modale au bout d'une minute

Je suis en utilisant le bootstrap modal dans un de mes projet. Je suis en utilisant les fonctions de minuterie pour afficher automatiquement le fichier de bootstrap modal.

Si l'utilisateur ne ferme pas le bootstrap modal pour une minute. Puis son automatiquement doit fermer le bootstrap modal.

Comment régler la minuterie de fermeture de l'modal bootstrap automatiquement?

Merci de bien vouloir m'aider à résoudre ce problème.

Merci d'Avance 🙂


var mins;
var secs;
function cd() {
mins = 1 * m("");
secs = 0 + s(":"); //change seconds here (always add an additional second to your total)
console.log(mins);
console.log(secs);
redo();
}
function m(obj) {
for(var i = 0; i ";
if(mins :";
disp += "";
if(secs ";
return(disp);
}
function redo() {
secs--;
if(secs == -1) {
secs = 59;
mins--;
}
$('#myModal').on('shown', function() {
//remove previous timeouts if it's opened more than once.
clearTimeout(myModalTimeout);
//hide it after a minute
myModalTimeout = setTimeout(function() {
$('#myModal').modal('hide');
}, 5000);
});
document.getElementById('timer_container').innerHTML = dis(mins,secs); 
if((mins == 1) && (secs == 45)) {
$("#myModal").modal('show');
$('#myModal').on('shown', function() {
//remove previous timeouts if it's opened more than once.
clearTimeout(myModalTimeout);
//hide it after a minute
myModalTimeout = setTimeout(function() {
$('#myModal').modal('hide');
}, 5000);
});
$('.timer-inc').click(function(){
$("#myModal").modal('hide');
href="includes/setSessionTime.php";
$.ajax({ 
type: "POST",
//data : {cat:"hai"},
cache: false,
url: href,   
success: function(data){
console.log(data);
$("#results").html(data);              
} 
});
});
$('.timer-close').click(function(){
$("#myModal").modal('hide');
href="includes/clearcart.php";
$.ajax({ 
type: "POST",
//data : {cat:"hai"},
cache: false,
url: href,   
success: function(data){
console.log(data);
$("#results").html(data);              
} 
});
});
$('#myModal').on('hidden', function () {
href="includes/clearcart.php";
$.ajax({ 
type: "POST",
//data : {cat:"hai"},
cache: false,
url: href,   
success: function(data){
console.log(data);
$("#results").html(data);              
} 
});    
});
}
else if((mins == 0) && (secs == 00)){
$("#myModal").modal('hide');
href="includes/clearcart.php";
$.ajax({ 
type: "POST",
//data : {cat:"hai"},
cache: false,
url: href,   
success: function(data){
console.log(data);
$("#results").html(data);              
} 
});
}
else {
cd = setTimeout("redo()",1000);
}
}
function init() {
cd();
}
Et vous avez essayé quoi?
pouvez-vous montrer à vos codes, en particulier fonctions de minuterie pour afficher automatiquement le modal bootstrap ?
inclus le code. Ce que j'ai essayé
ajouté le code maintenant.

OriginalL'auteur | 2013-06-14

  1. 12

    Essayer

    var myModal = $('#myModal').on('shown', function () {
clearTimeout(myModal.data('hideInteval'))
var id = setTimeout(function(){
myModal.modal('hide');
});
myModal.data('hideInteval', id);
})
    D'où je viens de passer les timings?
    Sa a Fonctionné parfaitement. Merci beaucoup mec 🙂
    Semble dans le bootstrap 3.2.0 'montré' événement est changé pour 'montrer.bs.modal'.
    C'est shown.bs.modal en fait. show.bs.modal existe aussi, mais est différent.

    OriginalL'auteur Arun P Johny

  2. 6

    Vous pouvez utiliser setTimeout en conjonction avec la fonction de rappel.

    $('#myModal').on('shown', function() {
//remove previous timeouts if it's opened more than once.
clearTimeout(myModalTimeout);
//hide it after a minute
myModalTimeout = setTimeout(function() {
$('#myModal').modal('hide');
}, 6e4);
});
    Salut, je vous Remercie pour votre réponse. J'ai essayé mais sa ne marche pas.
    Qu'est-ce que l'ID de votre modal?
    même myModal seulement. J'ai posté le code ci-dessus. Ce que j'ai essayé.
    6e4 ou 60000 ? et, @Synergiser toute JS erreur ?
    Pas de. Je n'ai pas d'erreur. J'ai essayé de 5000 pour le vérifier. Mais ne fonctionne pas.

    OriginalL'auteur Austin Brunkhorst

  3. 2

    Des définitions de fonction

    function show_modal(){
$('#myModal').modal('show');
}   
function hide_modal(){
$('#myModal').modal('hide');
}

    Chargement

    $(window).load(function(){
$('#myModal').modal('show');
window.setTimeout(hide_modal, 60000);
});

    OriginalL'auteur Fernando Ingunza

  4. 1

    Vous pouvez l'utiliser comme :

        setTimeout(function(){$('#myModal').modal('hide')},3000);

    OriginalL'auteur Kabir Hossain

  5. 0

    Essayez ceci, $('#someselector').modal({afficher: false})

    ne pas inclure les 1 minutes de compte à rebours.

    OriginalL'auteur user1390282

  6. 0

    Je suis à l'aide de cette méthode (bootstrap 3.2.0 et plus):

    Ajouter "modal-auto-clear" pour les auxiliaires modaux de la classe pour chaque modal vous souhaitez fermer automatiquement.

    <div class="modal fade modal-auto-clear" id="modal_confirmation" tabindex="-1" role="dialog">
...
</div>

    En jQuery:

    $('.modal-auto-clear').on('shown.bs.modal', function () {
$(this).delay(7000).fadeOut(200, function () {
$(this).modal('hide');
});
})

    Tous les auxiliaires modaux avec de la classe modale auto-clear " va maintenant se fermer 7 secondes après avoir ouvert (Vous pouvez modifier ce temps dans le jquery, le code bien sûr).

    Si vous souhaitez créer différentes autoclose fois par modale vous pouvez faire ceci:

    Ajouter la classe modale auto-clear " pour les auxiliaires modaux classe et ajouter l'attribut data-timer="3000" de la modals div:

    <div class="modal fade modal-auto-clear" data-timer="3000" id="modal_confirmation" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Your title</h4>
</div>
<div class="modal-body padded">Your body</div>
<div class="modal-footer">
<button type="button" id="close" data-dismiss="modal" aria-label="Close" class="btn btn-primary" style="display:none;">Close</button>
</div>
</div>
</div>
</div>

    En jQuery:

    $('.modal-auto-clear').on('shown.bs.modal', function () {
//if data-timer attribute is set use that, otherwise use default (7000)
var timer = $(this).data('timer') ? $(this).data('timer') : 7000;
$(this).delay(timer).fadeOut(200, function () {
$(this).modal('hide');
});
})

    OriginalL'auteur klaaz

  7. 0

    Facile..! 😀 Essayer cet homme! Faites-Moi Confiance.

    $(window).load(function(){
setTimeout(function(){
$('#myModal').hide();
}, 60000);
});

    OriginalL'auteur Oshan