如何在jQuery UI對話框中的兩組按鈕之間切換

Question

我有一個jQuery UI對話框，它在初始加載時顯示一組按鈕（說'添加'和'關閉'按鈕）。稍後，當我做一些事情時，我會顯示另一組按鈕（說當點擊'添加'按鈕時，我刪除現有按鈕並顯示'保存'和'清除'按鈕）。 再次當我點擊其他東西時，我會顯示最初的一組按鈕。

我正在尋找一種簡單的方法來處理這個按鈕設置切換在我的jQuery UI對話框。

*目前我正在調用按鈕定義，只要我想要的，但我認爲這不是做的方式。期待您的建議...

jQuery("#myDia").dialog({buttons: [{text:"Add", click: function() { add();}}, {text:"Close", click: function() {close();}}] });

和

jQuery("#myDia").dialog({buttons: [{text:"Save", click: function() { save();}},{text:"Clear", click: function() {clear();}}] });

Answer 1

您可以定義一個按鈕排列的按鈕列表。例如：

var buttonOpts = {}; buttonOpts["Add"] = function() { 
    add(); }; buttonOpts["Save"] = function() { 
    save(); }; buttonOpts["Clear"] = function() { 
    clear(); }; 

然後，當你想你可以使用option方法，像這樣的改變或切換按鈕列表：

$("#myDia").dialog('option', 'buttons', buttonOpts); 

jQuery用戶界面對話框參考：http://api.jqueryui.com/dialog/#method-option

這裏是一個工作小提琴：http://jsfiddle.net/nGUrw/6/