Push功能，以對象的前面字面

我有一些HTML彈出一個jQuery UI模式：Push功能，以對象的前面字面

<a href="my/url" class="popup">Click me</a>

有了這段JavaScript代碼：

$('.popup').click(function() { 
    var a = this; 

    var dialog = $('<div>').load($(a).attr('href'), function() { 
     var form = dialog.find('form'); 

     dialog.dialog({ 
      modal: true, 
      title: $(a).attr('title'), 
      buttons: { 
       Add : function() { 
        $.post($(form).attr('action'), $(form).serialize()); 
        dialog.dialog('close'); 
       }, 
       Cancel: function() { 
        dialog.dialog('close'); 
       } 
      } 
     }); 

     if ($(a).attr('data-third')) { 
      // Add here a button 
     } 
    }); 
    return false; 
});

的想法是在模態資源包含表格，在提交表格時提交。現在，當<a href="my/url" class="popup" data-third="Add & new">Click me</a>存在時，意味着第三個按鈕按以下順序放置在模式中：Cancel | Add | Add & new。

我試過這段代碼：

if($(a).attr('data-third')) { 
    var buttons = dialog.dialog('option', 'buttons'); 
    buttons[$(a).attr('data-third')] = function(){ 
     // Callback here 
    } 
    dialog.dialog('option', 'buttons', buttons); 
}

我有一個新的按鈕，但順序Add & new | Cancel | Add。我如何確保訂單是Cancel | Add | Add & new？

來源

2011-07-11 Jurian Sluiman

有了這個代碼，你應該總是讓取消|添加|新增&新？（從左至右

$('.popup').click(function() { 
    var a = this; 

    var dialog = $('<div>').load($(a).attr('href'), function() { 
     var form = dialog.find('form'); 

     dialog.dialog({ 
      modal: true, 
      title: $(a).attr('title'), 
      buttons: { 
       Cancel: function() { 
        dialog.dialog('close'); 
       }, 
       Add: function() { 
        $.post($(form).attr('action'), $(form).serialize()); 
        dialog.dialog('close'); 
       } 
      } 
     }); 

     if ($(a).data('third')) { 
      var buttons = dialog.dialog('option', 'buttons'); 
      console.log(buttons); 
      buttons[$(a).data('third')] = function() { 
       // Callback here 
      } 
      dialog.dialog('option', 'buttons', buttons); 
     } 
    }); 
    return false; 
});

小提琴這裏：http://jsfiddle.net/rqq2p/1/

別忘了使用數據（），而不是ATTRIB（）來得到該鏈接的屬性

編輯 - 基本上「按鈕」！是一個對象，每個屬性是按鈕之一，我認爲按鈕的順序是添加屬性的順序，在我的例子中，取消是最左邊的按鈕，因爲它是第一個添加的屬性，並添加&新的它是最右邊的，因爲它是最新的。如果你需要擺弄順序你可以c reate一個新的對象，然後在命令添加的屬性你想要的：

if ($(a).data('third')) { 
     var buttons = dialog.dialog('option', 'buttons'); 
     var newButtons = {}; 
     newButtons[$(a).data('third')] = function() { 
      // Callback here 
     } 
     newButtons['Cancel'] = buttons['Cancel']; 
     newButtons['Add'] = buttons['Add']; 
     dialog.dialog('option', 'buttons', newButtons);//now add & new should be the leftmost 
    }

來源

2011-07-11 07:52:16

感謝快速回復，但對我來說，這並不工作（順序變成添加和新，添加，取消）。唯一的變化就是取消訂單|添加你所做的，對嗎？我有jQuery 1.4.4，jQuery UI 1.8.11。還有關於data（）的好建議，不知道！ –

我編輯了我的答案，我試着jsfiddle與jquery 1.4.4，它的工作，我編輯我的答案與一些額外的信息 –

確實是正確的。應該雖然那:) –

未經檢驗的，但我想數組鍵應該是buttons.length這樣

if($(a).attr('data-third')) { 
    var buttons = dialog.dialog('option', 'buttons'); 
    buttons[buttons.length] = function(){ 
     // Callback here 
    } 
    dialog.dialog('option', 'buttons', buttons); 
}

來源

2011-07-11 07:50:21

沒有，按鈕是一個對象，而不是陣列 –

Push功能，以對象的前面字面

回答

相關問題