jQuery與Twitter引導模式一起使用

Question

使用bootstrap，我們從Button 1到Button 6大約有多個div。使用jquery時，將出現一個帶有另外2個按鈕的模式，請取消並確認。

現在，當我單擊“確認”時，模式將關閉並且按鈕的狀態將更改。 例如，Button1更改為“已單擊”。 當我單擊“取消”時，模態將關閉。

問題是這樣的：當我單擊第一個按鈕並取消，然后單擊第二個按鈕並確認時，兩個按鈕都將更改為“已單擊”

4個按鈕或5個按鈕的操作相同。

我的HTML

<!-- START OF PAID CUSTOM MODAL -->
<div id="paid-custom-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Fees Payment For</h3>
  </div>
  <div class="modal-body">
    CONFIRM?
  </div>
  <div class="modal-footer">
    <button class="paid-custom-cancel btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
    <button class="paid-custom-confirm btn btn-primary">Confirm</button>
  </div>
</div>
<!-- END OF PAID CUSTOM MODAL -->
  <div class="paid-custom">BUTTON 1</div>
  <div class="paid-custom">BUTTON 2</div>
  <div class="paid-custom">BUTTON 3</div>
  <div class="paid-custom">BUTTON 4</div>
  <div class="paid-custom">BUTTON 5</div>
  <div class="paid-custom">BUTTON 6</div>

我的jQuery

$(document).ready(function(){
  $(document).on('click', ".paid-custom", function() {
    var $this=$(this);

    $('#paid-custom-modal').modal();

    $(document).on('click', ".paid-custom-confirm", function() {
       $this.html('CLICKED');
        $('#paid-custom-modal').modal('hide');
    });
  });
});

Answer 1

編輯：

好的，我誤解了這個問題，請查看此代碼，它應該添加您想要的行為，但也可以考慮將狀態保存在Cookie中，否則每次刷新都會殺死該狀態，或者如果需要使用此按鈕，則需要進行適當的服務器端處理僅點擊一次

$(document).ready(function(){
    $(document).on('click', ".paid-custom", function() {
        $(this).addClass('active');
        $('#paid-custom-modal').modal().find('btn-primary');
    });
    $(document).on('click', ".paid-custom-confirm", function() {
           $('.active').html('CLICKED');
            $('#paid-custom-modal').modal('hide');
        });
     $(document).on('click', ".paid-custom-cancel", function() {
           $('.active').removeClass('active');
            $('#paid-custom-modal').modal('hide');
        });

});

問候簡