JQuery - функция запускается без нажатия кнопки

Question

Login-модал имеет 2 кнопки: «Логин» и «Сброс пароля» - при нажатии кнопки «сброс пароля», «Логин-модал» исчезает, и появляется «Сброс пароля-Модал». Если вы отмените «Login-Modal», никакой Password-Reset-Modal »не будет. Отлично. Однако после однократного нажатия кнопки« Password-Reset-Button »каждый раз, когда вы отменяете« Login-Modal »,« Password- Reset-Modal "появляется. Может ли кто-нибудь объяснить это странное поведение и как связать это поведение с событием щелчка? Заранее спасибо!

$('button#loginModal-password-reset_button').bind('click', function() {
    $('#loginModal').modal('hide').on('hidden.bs.modal',
    function() {
        $('#password-resetModal').modal('show');
    });
});

Попробовал также следующее безуспешно

$('button#loginModal-password-reset_button').click(function(e) {

$(document).on('click', 'button#loginModal-password-reset_button', function(e){

$('button#loginModal-password-reset_button').on('click', function(e) {

Answer 1

Не использовать обработчик событий. Попробуй это.

 $('button#loginModal-password-reset_button').bind('click', function() {
        $('#loginModal').modal('hide');
        $('#password-resetModal').modal('show');

    });

Если вы хотите отложить открытие # password-resetModal

$('button#loginModal-password-reset_button').bind('click', function() {
        $('#loginModal').modal('hide');
        setTimeout(function(){ 
                   $('#password-resetModal').modal('show');
                   }, 1000);
 });

Answer 2

Это потому, что вы добавляете обработчик событий в другой обработчик событий.Поэтому каждый раз, когда вы нажимаете кнопку сброса, вы добавляете другой обработчик hidden.bs.modal к модалу, и все они запускаются каждый раз, когда модальное скрыто.

Просто добавьте этот обработчик один раз, и кнопка сброса пароля должнапросто скрой это.

$('button#loginModal-password-reset_button').on('click', function() {
    $('#loginModal').modal('hide');
});
$('#loginModal').on('hidden.bs.modal', function() {
    $('#password-resetModal').modal('show');
});