Boostrap Modal不起作用

Question

你好，我希望你能幫我解決我現在遇到的問題。

我想使用模態按下按鈕時執行的JS代碼，問題是，誰擁有該按鈕的HTML代碼生成自身

主視圖頁面

<tr class="odd"> 
<td class=" sorting_1">CU</td> 
<td class="">Cliente Unico</td><td class="">101</td> 
<td class=""> 
<span id="edit_CU" class="ui-icon ui-icon-pencil" data-toggle="modal" data-target="#modal_edit"></span> 
<span id="delete_CU" class="ui-icon ui-icon-trash" data-toggle="modal" data-target="#modal_delete"></span> 
</td> 
</tr> 

在id =「edit_CU」當HTML代碼生成時CU發生變化，所以並不總是相同的那樣，即使用id =「delete_CU」

當您點擊span圖標時將觸發模式並顯示：

查看網頁時，點擊編輯或刪除按鈕

<div id="modal_delete" class="modal fade"> 
    <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title">Delete vertical</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Are you sure you want to delete?</p>     
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">No</button> 
       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal_delete">Yes</button> 
      </div> 
     </div> 
    </div> 
</div> 

<script type="text/javascript" src="<?php echo base_url('assets/js/helper/func_verticales.js');?>"></script> 

在這個視圖頁面詢問用戶是否要刪除自己的信息，當他們點擊「是」，應該彈出一個消息......但它確實沒什麼，有人可以幫我一把嗎？

這是JavaScript

$("#modal_delete").on('show.bs.modal', function(event){ 
    alert("hello"); 
    }); 
}); 

Answer 1

如果我正確比理解你你必須委派點擊事件 嘗試這樣的事情：

你的按鈕需要一些適應 - 因爲我沒有看到數據切換和數據目標

<button type="button" class="btn btn-primary">Yes</button> 

之後是有原因的 - 在你的JS代碼：

$("button.btn-primary").on("click","#modal_delete",function() 
{ 
    alert("hello"); 
}); 

Answer 2

運行的是提醒了你的按鈕，而不是模式

<button id="modal_delete">Yes</button> 

$("#modal_delete").on('click', function(event){ 
    alert("hello"); 
    }); 
}); 

，或者使用一個確認框

$('#modal_delete').click(function(ev){ 
     ev.preventDefault(); 
     var r = confirm("Are you sure?"); 
     if (r == true) { 
      //run delete code here 
     } 
    });