Chamando uma Função no Modal de Inicialização Aberta

Eu costumava usar a caixa de diálogo da UI do JQuery, e tinha a openopção, onde você pode especificar algum código Javascript para executar quando a caixa de diálogo for aberta. Eu teria usado essa opção para selecionar o texto na caixa de diálogo usando uma função que tenho.

Agora eu quero fazer isso usando o modal do bootstrap. Abaixo está o código HTMl:

<div id="code" class="modal hide fade">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        <pre>
print 'Hello World'

E quanto ao botão que abre o modal:

 <a href="#code" data-toggle="modal" class="btn code-dialog">Display code</a>

Tentei usar um ouvinte ao clicar no botão, mas a mensagem de alerta foi exibida antes do modal aparecer:

$( ".code-dialog" ).click(function(){
    alert("I want this to appear after the modal has opened!");
});

Você pode usar o evento / evento mostrado com base no que você precisa:

$( "#code" ).on('shown', function(){
    alert("I want this to appear after the modal has opened!");
});

Demonstração: Plunker

Atualização para o Bootstrap 3.0

Para o Bootstrap 3.0, você ainda pode usar o evento mostrado, mas o usaria assim:

$('#code').on('shown.bs.modal', function (e) {
  // do something...
})

Veja os documentos do Bootstrap 3.0 aqui em "Eventos".

não vai funcionar .. use em $(window)vez disso

Para mostrar

$(window).on('shown.bs.modal', function() { 
    $('#code').modal('show');
    alert('shown');
});

Para Esconder

$(window).on('hidden.bs.modal', function() { 
    $('#code').modal('hide');
    alert('hidden');
});

você pode usar em showvez de shownfazer a função carregar imediatamente antes da abertura modal, em vez de depois da abertura modal.

$('#code').on('show.bs.modal', function (e) {
  // do something...
})

O modal de bootstrap expõe eventos. Ouça o shownevento como este

$('#my-modal').on('shown', function(){
  // code here
});

se alguém ainda tiver um problema, a única coisa que funcionará perfeitamente para mim usando (loaded.bs.modal):

 $('#editModal').on('loaded.bs.modal', function () {
       console.log('edit modal loaded');

       $('.datepicker').datepicker({
            dateFormat: 'yy-mm-dd',
            clearBtn: true,
            rtl: false,
            todayHighlight: true,
            toggleActive: true,
            changeYear: true,
            changeMonth: true
        });
});

Você pode usar o código belw para mostrar e ocultar o modelo de inicialização.

$('#my-model').on('shown.bs.modal', function (e) {
  // do something here...
})

e se você deseja ocultar o modelo, pode usar o código abaixo.

$('#my-model').on('hidden.bs.modal', function() {
    // do something here...
});

Espero que esta resposta seja útil para o seu projeto.