1

在我们的应用程序中，我们使用一个通用函数来创建包含特定模块内容的 jQuery 对话框。自定义对话框由 3 个按钮（取消、保存、应用）组成。应用与保存相同，但也会关闭对话框。

许多模块仍在使用自定义帖子而不是 ajax-post。出于这个原因，我希望覆盖/重新定义特定对话框上的按钮。

到目前为止，我已经有了按钮，但我无法对它们做些什么。是否可以从对话框中获取按钮（是的，我知道）但对它们应用不同的功能？

到目前为止我的代码：

function OverrideDialogButtonCallbacks(sDialogInstance) {
  oButtons = $( '#dialog' ).dialog( 'option', 'buttons' );
  console.log(oButtons); // logs the buttons correctly

  if(sDialogInstance == 'TestInstance') {
    oButtons.Save = function() {
      alert('A new callback has been assigned.');
      // code for ajax-post will come here.
    }
  }
}
4

4 回答 4

2 
$('#dialog').dialog({
'buttons' : {
    'Save' : {
        id:"btn-save", // provide the id, if you want to apply a callback based on id selector
        click: function() {
           //
        },
    },
}
});

你试过这个吗？根据需要覆盖按钮的回调。

于 2012-10-09T10:06:48.800 回答
2

根本不需要重新分配。试试这个。

function OverrideDialogButtonCallbacks(dialogSelector) {
    var button = $(dialogSelector + " ~ .ui-dialog-buttonpane")
                    .find("button:contains('Save')");

    button.unbind("click").on("click", function() {
        alert("save overriden!");
    });
}

像这样称呼它OverrideDialogButtonCallbacks("#dialog");

工作小提琴：http: //jsfiddle.net/codovations/yzfVT/

于 2012-10-09T11:42:06.000 回答
1

您可以使用$(..).dialog('option', 'buttons'). 这将返回一个对象数组，然后您可以通过搜索它们并调整点击事件来重新连接：

// Rewire the callback for the first button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons[0].click = function() { alert('Click rewired!'); };

看这个小提琴的例子：http: //jsfiddle.net/z4TTH/2/

如有必要，您可以使用 . 检查按钮的文本button[i].text。

更新：

该buttons选项可以是两种形式之一，一种是如上所述的数组，另一种是对象，其中每个属性都是按钮的名称。要在这种情况下重新连接 click 事件，需要更新buttons对话框中的选项：

// Rewire the callback for the OK button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons.Ok = function() { alert('Click rewired!'); };

$('#dialog').dialog('option', 'buttons', buttons);

看到这个小提琴：http: //jsfiddle.net/z4TTH/3/

于 2012-10-09T10:30:08.760 回答
0

您可以尝试将您的新功能代码与 Save 的 Click 事件绑定吗？

if(sDialogInstance == 'TestInstance') {
            $('#'+savebtn_id).click(function() {
              alert('A new callback has been assigned.');
              // code for ajax-post will come here.
            });
    }
于 2012-10-09T10:15:49.880 回答