在jQuery对话框中向我的按钮添加图标

Question

我有一个jquery对话框，我在表格中使用了一些按钮（用于编辑/删除功能）。

只有在我之前编码警报时，我才能在这些按钮上添加图标。很奇怪。如果我删除警报，则不会显示按钮。

$().ready(function () {

    $('.MaterialEdit').live("click", function () {
        alert('clicked');
        $(".MaterialPackingEdit").button({ icons: { primary: "ui-icon-pencil"} });
        $(".MaterialPackingRemove").button({ icons: { primary: "ui-icon-trash"} });    
    });
});

上面使用的MaterialEdit类对应于我主页面上的一个按钮，用于打开jQuery对话框。

有什么想法吗？

感谢。

Answer 1

问题中的一些标记肯定会有所帮助。无论如何，这里的东西适用于jsFiddle - http://jsfiddle.net/FloydPink/e3pCL/

我们的想法是使用dialog demo page中记载的'open'事件，如下所示：

    open: function(event, ui) {
        $('.MaterialPackingEdit').button({
            icons: {
                primary: "ui-icon-pencil"
            },
            text: false
        });
        $('.MaterialPackingRemove').button({
            icons: {
                primary: "ui-icon-trash"
            },
            text: false
        });
    }

希望有所帮助。

编辑：要将函数本身传递给注释中提及的通用“对话框加载器”函数OP，可以使用下面的代码片段：

$(function() {
    var onDialogOpen = function(event, ui) {
            $('.MaterialPackingEdit').button({
                icons: {
                    primary: "ui-icon-pencil"
                },
                text: false
            });
            $('.MaterialPackingRemove').button({
                icons: {
                    primary: "ui-icon-trash"
                },
                text: false
            });
        };
    $('.dialog').dialog({
        autoOpen: false,
        title:'Buttons As Icons on a jQuery Dialog',
        width: 400,
        open: onDialogOpen
    });
    $('.MaterialEdit').click(function() {
        $('.dialog').dialog('open');
    });
});

将此更新检查到jsFiddle - http://jsfiddle.net/FloydPink/e3pCL/27/