前端框架-Bootstrap【搭建後臺管理系統】

模態框：

不一樣的按鈕打開同一個id=myModal的模態框，有時候須要傳入一個參數（flag）來進行區分是哪個按鈕打開的

那麼直接上代碼了

第一個按鈕button屬性裏面加入data-whatever="add"

1 <button id="sure_pre_release_draft" type="button" data-toggle="modal" data-target="#myModal" data-whatever="add" class="btn btn-primary btn-sm">
2     <span class="glyphicon glyphicon-plus"></span>
3 </button>

第二個按鈕button屬性裏面加入data-whatever="edit"

1 <button id="sure_pre_release_draft" type="button" data-toggle="modal" data-target="#myModal" data-whatever="edit" class="btn btn-primary btn-sm">
2     <span class="glyphicon glyphicon-plus"></span>
3 </button>

而後經過模態框觸發事件來獲取

 1 $("#myModal").on("show.bs.modal",function(e){  2     //得到點擊打開的按鈕  3   var button=$(e.relatedTarget);  4     //根據標籤得到按鈕傳入的參數  5  var recipient=button.data("whatever");  6  //console.log(recipient);  7  if(recipient == "edit"){  8  do something.............  9  } 10  if(recipient == "add"){ 11  do something............. 12  } 13 });

原理來源：https://v3.bootcss.com/javascript/#modals-related-target