打開模態時，如何將按鈕聚焦在模態內

Question

當調用模態彈出窗口時，我需要關注模態上的第一個按鈕。
該按鈕動態附加到模態頁腳

var difVal = ( totalAmnt - payAble ).toFixed(2);         
$('#chqMsgContent').html( 'Total Diffrent than the Recive Amount. ( ' + difVal + ' )</br> (Please type manually for over payment) ');        
$('#myModal').modal('show');
$('.modal-dialog').css('width', '350');     
var btnsForModl = '<input type="button" class="btn  btn-xs ok" id="okDif" data-dismiss="modal" value="Ok" data-value="Cash" /> ';       
$('.modal-footer').html(btnsForModl);   

$('#okDif').focus();                

$('#okDif').focus(); 沒有工作比我試過這個

$('#myModal').on('shown', function () {
     alert($('#okDif').val());
     $('#okDif').focus();
}); 

這兩種方法都不起作用，但彈出窗口工作正常。

JSFiddle演示

Answer 1

您需要為focus命令添加一個輕微的超時，否則它會在元素出現之前觸發。

這有效：

$(document).on('click', '#on', function(){  
  $('#chqMsgContent').html('Total Diffrent than the Recive Amount');         
  ...
  setTimeout(function(){ 
    $("#okDif").focus();
  }, 150);
});

DEMO

Answer 2

模態內部的任何內容最初都是隱藏的 ，因此input元素（ 隱藏 ）無法關注 。
如果你不需要動畫模態，你可以簡單地刪除模態的fade類，這樣在你調用.modal('show')之后就可以立即看到模態內容。
的jsfiddle

---

你已經嘗試將無法工作，因為引導模式沒有事件的其他選項，稱為shown 。
它有一個shown.bs.modal事件：

$('#myModal').on('shown.bs.modal', function(e){
    $('#okDif').focus();
});

的jsfiddle