Twitter的引導模式確認對話框

Question

我無法弄清楚如何實施與引導模式確認對話框，這是我的代碼不能正常工作：

<div id="id" class="modal hide"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h3>title</h3> 
    </div> 
    <div class="modal-body"> 
     <p>confirm message</p> 
    </div> 
    <div class="modal-footer"> 
     <button data-dismiss="modal" class="btn">No</button> 
     <button id="id-confirm" class="btn btn-primary">Yes</button> 
    </div> 
</div> 
<a id="a" href="http://example.com">link</a> 
<script type="text/javascript"> 
    var confirmed = false; 
    var modal = $('#id'); 
    var clickee = $('#a'); 

    clickee.click(function() { 
     if (!confirmed) { 
      modal.modal('show'); 
      return false; 
     } 
    }); 
    $('#id-confirm').click(function() { 
     confirmed = true; 
     clickee.click(); 
     modal.modal('hide'); 
    }); 
</script> 

當我點擊鏈接link時，對話框彈出，但是當我確認後，沒有重定向發生，當我再次點擊鏈接link時，我得到重定向。我可以重定向到鏈接的href，但我想讓它可重用，而不是鏈接（a元素）我也可以使用按鈕或在按鈕上定義onclick事件。

謝謝您的回答。

Answer 1

讓我先了解這一點。

你需要點擊一個引導確認模式需要打開的鏈接，然後點擊是，用戶需要去不同的鏈接？

如果是這樣的話：

<a id="a" href="#id" data-toggle="modal">link</a> 

，然後你爲什麼不重定向的按鈕，點擊編號，確認

您需要刪除HREF =「http://example.com」因爲bootstrap模式不知道應該打開哪個div。

Answer 2

在jQuery中，Click()不會激活<a> -tag，因爲它是用戶點擊的，它只會調用您附加的任何onclick=。

事實上，clickee.click();只要求您的匿名函數clickee.click(function() {，但沒有happends，因爲confirmed爲真（嘗試在click()插入警報證明）。當你再次點擊時，點擊事件不會被引導程序暫停（stopPropagation），現在它就像普通鏈接一樣工作。那就是你所經歷的。

我不能完全確定你想要什麼，但如果你想激活鏈接，確認後，重定向是最簡單的方法（我知道你沒有想這一點，但你不能用click()做，要麼，因爲代碼是現在）

$('#id-confirm').click(function() { 
    confirmed = true; 
    window.location=clickee.attr('href'); 
    modal.modal('hide'); 
}); 

會的工作，並與其他類型的代碼可重複使用的像<button>，只要你指定了href屬性。

Answer 3

有一個庫可以爲你做很多事情：http://bootboxjs.com。 YMMV