モーダルボタンをクリックする必要があります

Question

ダイアログボックスの外側をクリックすると、ブートストラップモーダルが閉じないようにするにはどうすればよいですか？私はモーダルでボタンをクリックするように強制したいからです。

は下記下記のブートストラップ

<!-- Approve Modal --> 
     <div class="modal fade alert-success" id="approvemodal" role="dialog"> 
      <div class="modal-dialog"> 

      <!-- Modal content--> 
      <div class="modal-content"> 
       <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Approved!</h4> 
       </div> 
       <div class="modal-body"> 
       <p>Return to vendor approved. </p> 
       </div> 
       <div class="modal-footer"> 
       <button id="approvedone" type="button" class="btn btn-lg btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-ok"> Done</button> 
       </div> 
      </div> 

      </div> 
     </div> 

Answer 1

からの私のモーダルの一例である、それを行うための近代的な方法です。モーダルを動的に作成する方法の詳細については、this linkを参照してください。

function open_modal() { 
 
    
 
    BootstrapDialog.show({ 
 
    title: 'Approved!', 
 
    message: 'Return to vendor approved.', 
 
    closeByBackdrop: false, 
 
    closeByKeyboard: false, 
 
    buttons: [{ 
 
     label: '<span class="glyphicon glyphicon-ok"> Done', 
 
     action: function(dialog) { 
 
     dialog.close(); 
 
     } 
 
    }] 
 
    }); 
 
}

<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/css/bootstrap-dialog.min.css"> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> 
 

 

 
<!-- jQuery library --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 

 
<!-- Latest compiled JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script> 
 

 
<button onclick="open_modal()" type="button"> Open dialog</button>