引導模式想要自動對焦確定按鈕

Question

我有一個模態。有一個OK按鈕。我想把焦點放在按鈕上。我曾嘗試過自動對焦，但它只關注一秒鐘，然後消失。

內_Layout.cshtml的代碼是：

<!-- modal that can notify users of errors --> 
<div id="error-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="error-modal" aria-hidden="true"> 
    <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal"> 
        <span aria-hidden="true">&times;</span> 
        <span class="sr-only">Close</span> 
       </button> 
       <h4 class="modal-title" id="myModalLabel">Notice</h4> 
      </div> 

      <div class="modal-body"> 
       <ul> 
        <!-- ko foreach: ModalErrors --> 
        <li data-bind="text: $data"></li> 
        <!-- /ko --> 
       </ul> 
      </div> 

      <div class="modal-footer"> 
       <button type="button" class="btn btn-primary" data-dismiss="modal">OK</button> 
      </div> 
     </div> 
    </div> 
</div> 

欠文件中的代碼是：

#error-modal, #info-modal, #action-modal { 
    .modal-dialog { 
     z-index: 1100; 
    } 
    .modal-content { 
     border-radius: 0 4px; 
     //border-radius: 0; 

     ul { 
      padding-left: 20px; 
     } 
    } 
    .modal-footer { 
     button { 
      border-radius: 0; 
     } 
     .btn-primary { 
      background-color: @seal-yellow; 
      border-color: @seal-grey; 
      color: @seal-black; 
     } 
    } 
} 

Answer 1

您可以使用此JS代碼做到這一點：

modal = $("#error-modal"); 
modal.find('.btn-primary').focus(); 

此代碼將要求jQuery

Answer 2

如果使用自舉3，你可以專注元素一旦模式已經被鉤住模式顯示事件屏幕上顯示：

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

見Boostrap Modal events

Answer 3

我不得不添加ID =「OK-通知按鈕「我的按鈕類型...使用JavaScript然後：

 <div class="modal-footer"> 
      <button type="button" class="btn btn-primary" data-dismiss="modal">OK</button> 
     </div> 


$("#error-modal").on('shown.bs.modal', function (event) { 
    $("#ok-notice-button").focus(); 
});