1

jQueryダイアログがあります:

    // Configure buttons
    var dialogButtons = {};

    dialogButtons[buttonConfirm] = function () {
        $.ajax({
            type: "Post",
            url: href,
            cache: false,
            success: function (data) { var func = success; window[func](data); }
        });
        $(this).dialog("close");
    };

    dialogButtons[buttonCancel] = function () {
        $(this).dialog("close");
    };

    // Configure dialog
    $dialog.dialog(
        {
            modal: true,
            closeOnEscape: true,
            resizable: false,
            buttons: dialogButtons
        });

    // Opening dialog
    $dialog.dialog('open');

私の質問: ボタンに特定のクラス「btn」を設定したいと思います。これどうやってするの?

ありがとう

4

3 に答える 3

1

@Colinには1つの答えがありましたが、問題のダイアログにもっと具体的にしたいと思いました。jQuery-UIにはwidget、ダイアログ自体で構成される要素を返すメソッドがあります。これをロケーティングui-buttonクラスと組み合わせると、探しているものを取得できます。

$dialog.dialog('widget') // Grab widget (UI element)
  .find('.ui-button')    // Locate buttons within
  .addClass('btn');      // hadd btn class to them

編集:また、ここに例があります:http: //jsfiddle.net/8WckB/

于 2012-04-18T12:48:31.403 に答える
1
// Configure dialog
$dialog.dialog({
    modal: true,
    closeOnEscape: true,
    resizable: false,
    buttons: dialogButtons,
    open: function(e, ui) { 
        $(this).parents(".ui-dialog").find(".ui-dialog-buttonset"); // here is your 
                                                                    // button container
        $(this).parents(".ui-dialog").find(".ui-dialog-buttonset .ui-button").addClass("btn"); // whereas this would select
                                                                                               // all buttons in button container
        // you could even use the widget method
        // $(this).dialog("widget").find(".ui-dialog-buttonset .ui-button")
    }
});
于 2012-04-18T12:50:44.813 に答える
1

ソースを見ると、 のメソッド_createButtonsjquery.ui.dialog.js、ボタンのテキストによってインデックス付けされたハッシュが、関数でない場合、プロパティのコレクションとして扱われていることがわかります。したがって、次のことができます。

var $dlg = $('#dlg').dialog({
    buttons: {
        'firstButton': {            
            'click': function() {
                $dlg.dialog('close');
            },
            'text' : 'OK',         
            'class': 'myclass'
        },
        'Cancel': function(){
            $dlg.dialog('close');
        }
    }
});

これは、コードを示すブラッドのフィドルのフォークですhttp://jsfiddle.net/uWnpy/

于 2012-04-18T13:50:59.703 に答える