확인 메시지에 부트 스트랩 사용 onclick()

Question

저는 부트 스트랩이 새롭고 메시지 확인을위한 코드를 작성했습니다.

다음 코드를 사용하여 onclick()을 어떻게 넣을 수 있습니까? bootbox의

$("#myModal").on("show", function() { // wire up the OK button to dismiss the modal when shown 
    $("#myModal a.btn").on("click", function(e) { 
     console.log("button pressed"); // just as an example... 
     $("#myModal").modal('hide');  // dismiss the dialog 
    }); 
}); 
$("#myModal").on("hide", function() { // remove the event listeners when the dialog is dismissed 
    $("#myModal a.btn").off("click"); 
}); 

$("#myModal").on("hidden", function() { // remove the actual elements from the DOM when fully hidden 
    $("#myModal").remove(); 
}); 

$("#myModal").modal({     // wire up the actual modal functionality and show the dialog 
    "backdrop" : "static", 
    "keyboard" : true, 
    "show"  : true      // ensure the modal is shown immediately 
}); 

는 HTML : onclick을

HTML (image)

() 입력 :

<input type='submit' name='actualiza_noticia' class='button' onClick="" value='Atualizar notícia'>  

Answer 1

당신은 하나를 사용하고 JQuery와 기능 $(elem).modal('show') 기능을 사용하거나 부트 스트랩 HTML 데이터 속성 수 있습니다 :

데이터 사용 attrib 백인 군대 :

<input type='submit' data-toggle="modal" data-target="#myModal" name='actualiza_noticia' class='button' value='Atualizar notícia' >  

JQuery와 기능 사용 :

<input onclick="$('#myModal').modal('show')" type='submit' name='actualiza_noticia' class='button' value='Atualizar notícia' >  

은이 두 이벤트를 트리거 shuold을의 'show' 이벤트가 'shown.bs.modal'가 부트 스트랩 3을 준수 수 있지만 자세한

$("#myModal").on('shown.bs.modal', function() { // wire up the OK button to dismiss the modal when shown 
    $("#myModal a.btn").on("click", function(e) { 
     console.log("button pressed"); // just as an example... 
     $("#myModal").modal('hide');  // dismiss the dialog 
    }); 
}); 

읽기 부트 스트랩 모달에 대해서 here.

Answer 2

내 제안이 당신의 HTML을보고 이미지에 따르면 ("shown.bs.modal"함수() { 에 $ ("#의 myModal")`에

• 변화 $("#myModal").on("show", function() {. $("#myModal a.btn").on("click", function(e) {$("#myModal button.btn.btn-primary").off("click");

- $("#myModal").on("hide", function() { 변화 $("#myModal a.btn").off("click");

$("#myModal").on("hide.bs.modal", function() {로 변경

$("#myModal button.button.btn.btn-primary").on("click", function(e) {로 변경

세부 bootstrap modals

$(function() { 
 
      $("#myModal").on("shown.bs.modal", function() { // wire up the OK button to dismiss the modal when shown 
 
       $("#myModal button.btn.btn-primary").on("click", function(e) { 
 
        console.log("button pressed"); // just as an example... 
 
        $("#myModal").modal('hide');  // dismiss the dialog 
 
       }); 
 
      }); 
 
      $("#myModal").on("hide.bs.modal", function() { // remove the event listeners when the dialog is dismissed 
 
       $("#myModal button.btn.btn-primary").off("click"); 
 
      }); 
 

 
      $("#myModal").on("hidden", function() { // remove the actual elements from the DOM when fully hidden 
 
       $("#myModal").remove(); 
 
      }); 
 

 
      $("#myModal").modal({     // wire up the actual modal functionality and show the dialog 
 
       "backdrop" : "static", 
 
       "keyboard" : true, 
 
       "show"  : true      // ensure the modal is shown immediately 
 
      }); 
 
     });

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 
<div id="myModal" class="modal fade"> 
 
    <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
      <!-- dialog box --> 
 
      <div class="modal-body"> 
 
       <button type="btn btn-default" class="close" data-dismiss="modal">&times;</button> 
 
       Hello world! 
 
      </div> 
 
      <!-- dialog buttons --> 
 
      <div class="modal-footer"> 
 
       <button type="btn btn-default" class="btn btn-primary">OK</button> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>