通過數組中的函數引導模式綁定按鈕動作

Question

以下函數使用Bootstrap和JQuery顯示模態。爲了使其更靈活，我想添加儘可能多的按鈕，並在按下這些按鈕時綁定功能。

blnShowWindow("This is <b>html</b> content", "This is a title", [ 
{strTitle: 'CCancel', strStyle: 'default', fncAction: function() { alert("ccccc"); } }, 
{strTitle: 'OOK', strStyle: 'primary', fncAction: function() { alert("ok"); } }]); 

在不同的地方：

intButtonC = 0; 
blnShowWindow = function (htmlContent, strTitle, arrButtons) { 
    //.... 
    $.each(arrButtons, function (intIndex, arrButton) { 
    intButtonC += 1; 
    strButtonID = "btnModalButton" + intButtonC; 
    $("#divModalFooter").html($("#divModalFooter").html() + 
     '<button type="button" class="btn btn-'+arrButton.strStyle+ 
     '" id="'+strButtonID+'">'+arrButton.strTitle+'</button>'); 
    $("#"+strButtonID).unbind().bind("click",arrButton.fncAction); 
    }); 
    $("#divModal").modal(); 
}; 

兩個按鈕，CCancel和OOK顯示細膩。點擊OOK時，警告框會正確顯示，並顯示「ok」。問題是，CCancel單擊時不會執行任何操作。數組定義是否正確？我究竟做錯了什麼？？

還有更好的方法來定義高度靈活的Bootstrap模態？

Answer 1

的問題是，你overwritting已綁定的按鈕，在該行...

$("#divModalFooter").html($("#divModalFooter").html() + ... 

例如，如果你試試這個，代碼工作

intButtonC = 0; 
blnShowWindow = function (htmlContent, strTitle, arrButtons) { 
    $.each(arrButtons, function (intIndex, arrButton) { 
    intButtonC += 1; 
    strButtonID = "btnModalButton" + intButtonC; 
    $("#divModalFooter").html($("#divModalFooter").html() + 
     '<button type="button" class="btn btn-'+arrButton.strStyle+ 
     '" id="'+strButtonID+'">'+arrButton.strTitle+'</button>'); 

    }); 

    intButtonC = 0; 
    $.each(arrButtons, function(intIndex, arrButton){ 
    intButtonC += 1; 
    strButtonID = "btnModalButton" + intButtonC; 
    $("#"+strButtonID).unbind().bind("click",arrButton.fncAction); 
    }); 

    $("#divModal").modal(); 

在另一個你綁定所有的按鈕