Функция обратного вызова в модуле bootstrap3

Немного смущает об увольнении функции обратного вызова в javascript-модале bootstrap3. В обычном jquery.post вы можете сделать это,

$.post('path', { something: something }, function(data) { 
  console.log(data);
});

Но в bootstrap 3 modal я запускаю modal через script, и я делаю это, как эта база, о том, как я понимаю объяснение на своем веб-сайте.

$('selector').modal('show', function() { 
  //here comes the problem, I have a button in the modal in the html, my code
  //if the button was clicked inside this modal is..

  $('#myButton').on('click', function() { 
     console.log("this is a try");
  });
});

Но грустно сказать, что если я нажму кнопку, ничего не происходит, ничего не было зарегистрировано на консоли. Как вызвать функцию обратного вызова в модальном бутстрапе 3?

Ответ 1

Для Bootstrap 3 события теперь заменены именами, поэтому для <модa > мода show будет show.bs.modal...

$('#myModal').on('show.bs.modal', function (e) {
    alert('modal show');
});

Демо: http://bootply.com/90952

Ответ 2

Немного добавить для первого ответа, потому что, когда срабатывает обратный вызов, DOM внутри модала еще не полностью загружен, возможно, придется немного взломать здесь, чтобы немного приостановить действие после обратного вызова. Надеюсь, это поможет!

$('#myModal').on('show.bs.modal', function (e) {
    setTimeout(function(){
        // something here
    }, 300);
});

Ответ 3

@Skelly является правильным, вы можете использовать событие show.bs.modal следующим образом:

$('#myModal').on('show.bs.modal', function (e) {
    alert('modal show');
});

В официальной документации говорится:

Это событие срабатывает сразу же после вызова метода show instance.

Обратите внимание, что это событие запускается "довольно скоро", и вам может потребоваться вместо этого использовать shown.bs.modal.

Документация об этом событии:

Это событие запускается, когда модальное изображение становится видимым для пользователя (будет ждать завершения CSS-переходов).

Это влияет на ответ @Keith yeoh, и вы должны избегать тайм-аутов, когда это возможно.

Источник: Официальная документация по загрузке

Ответ 4

Я думаю, что лучше будет, чтобы использовать "показанный .bs.modal", он становится более опасным, когда модаль уже загружен. Модальные события Bootstrap

$('#myModal').on('shown.bs.modal', function (e) {
    alert('modal is allready shown');
});