为什么我的回调函数每次点击都会成倍增加？

Question

因此，我做了一个简单的回调函数，但是由于某些原因，每次我单击“接受”按钮时，回调函数都会运行两次。

为什么会这样，我是否应该为此目的使用其他东西，也许可以保证？]​​>

这是jsfiddle示例https://jsfiddle.net/p7oq63gL/

这是js

function confirm(options = {}, o, run){


$('.toast-container').fadeIn();
  $('.toast.confirm .toast-header strong').html(options['title']);
  $('.toast.confirm .submit-toast').addClass(options['cls']);
  $('.toast.confirm .toast-body').html(options['message']);
  $('.toast.confirm').toast({
    autohide: false
  }).removeClass('invisible').toast('show');

  $('.submit-toast').on('click', function(){
    run(o);
    $('.toast-container').fadeOut();
    $('.toast.confirm').addClass('invisible');
  });

  $('[data-dismiss-toast]').on('click', function(){
    $('.toast-container').fadeOut();
    $('.toast.confirm').addClass('invisible');
  });
}
$(document).ready(function(){
$(document).on('click', '#banner-message button', function(){
        var toTrashEl = $(this);
        confirm({
            'message': 'Are you sure you want to press this button?</b>',
            'title': 'Ametid',
            'cls': 'bg-danger'
          }, [toTrashEl], function(o){
              o[0].parents('.slideLeft').addClass('removed');
            setTimeout(function(){
                o[0].parents('.slideLeft').remove();
            }, 500);
            $('#banner-message').prepend('<p>Hello World</p>');
          });
    });

});

因此，我做了一个简单的回调函数，但是由于某些原因，每次我单击“接受”按钮时，回调函数都会运行两次。为什么会发生这种情况，我是否应该将其他东西用于...

Answer 1

[confirm函数每次运行时，您都在[]中的submit-toast和data-dismiss-toast中添加新的侦听器>

  $('.submit-toast').on('click', function(){
    run(o);
    $('.toast-container').fadeOut();
    $('.toast.confirm').addClass('invisible');
  });

  $('[data-dismiss-toast]').on('click', function(){
    $('.toast-container').fadeOut();
    $('.toast.confirm').addClass('invisible');
  });