jQuery Ui 对话框按钮，如何添加类? [英] jQuery Ui Dialog Buttons, How to add class?

问题描述

我在另一个帖子上找到了这个答案..

I found this answer on another thread..

如何在 Jquery UI 对话框中添加多个按钮盒子?

使用这种语法，如何为特定按钮添加类?

Using this syntax, how do you add class to a particular button?

 $("#mydialog").dialog({
      buttons: {
        'Confirm': function() {
           //do something
           $(this).dialog('close');
        },
        'Cancel': function() {
           $(this).dialog('close');
        }
      }
    });

推荐答案

看起来没有很好的方法可以通过 API 做到这一点，但是您可以在 create:

It doesn't look like there's a great way to do this via the API, however you could add the classes in an event handler for create:

$("#dialog").dialog({
    buttons: {
        'Confirm': function() {
            //do something
            $(this).dialog('close');
        },
        'Cancel': function() {
            $(this).dialog('close');
        }
    },
    create:function () {
        $(this).closest(".ui-dialog")
            .find(".ui-button:first") // the first button
            .addClass("custom");
    }
});

如果你想要第二个按钮，你可以使用:

If you wanted the second button, you could use:

$(this).closest(".ui-dialog").find(".ui-button").eq(1).addClass("custom") // The second button

关键是 $(this).closest(".ui-dialog").find(".ui-button")，它将选择对话框中的按钮.之后，您可以应用您想要的任何选择器(包括 :contains(...) 如果您想根据其文本而不是其顺序来选择按钮，这可能很有用).

The key is the $(this).closest(".ui-dialog").find(".ui-button"), which will select the buttons in your dialog. After that, you could apply any selector you want (including :contains(...) which might be useful if you want to select a button based on its text instead of its order).

这是一个例子:http://jsfiddle.net/jjdtG/

还要注意，您要应用的样式的 CSS 选择器必须比 jQueryUI 的内置选择器更具体，才能应用样式.

Also note that the CSS selector for the style(s) you want to apply has to be more specific than jQueryUI's built-in selectors in order for the styling to be applied.

这篇关于jQuery Ui 对话框按钮，如何添加类?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！