6

アプリ全体に jquery-ui ダイアログがたくさんあります。新しいものが必要になるたびに、次の行を書きます。

$('.another-dialog').dialog({
  title: 'Another dialog',
  autoOpen: false,
  draggable: true,
  modal: true,
  show: 'fade',
  hide: 'fade',
  width: 400,
  position: ['center', 'center'],
  buttons: [
    { text: 'Ok' },
    { text: 'Cancel' }
  ],
  open: function(event, ui) { $(".ui-dialog-titlebar-close span").html('×') }
});

あるダイアログと別のダイアログで実際に異なるのは、 キーbuttonsとtitleキーだけです。ここで必要なのは、JQuery ダイアログのアプリケーション全体のセットアップです。

$('.another-dialog').dialog({
  title: 'Another dialog',
  buttons: [
    { text: 'Ok' },
    { text: 'Cancel' }
  ]
});

必要なすべてのハッシュキーが暗黙的に設定されています（私はそれを「デフォルト」設定と呼んでいます）。

私は、自分ですべてを設定した場所に.dialog()コールをラップできることを知っています。.myDialog()しかし、それを行うための本当に便利な方法があるのだろうか。

前もって感謝します！

4

2 に答える 2

5

共通のオプションを変数 (または、異なるスコープから使用する場合はドキュメントに関連付けられたデータ) に入れることができます。

$(document).data("common-dialog-options", {
    autoOpen: false,
    draggable: true,
    modal: true,
    show: "fade",
    hide: "fade",
    width: 400,
    position: ["center", "center"],
    open: function(event, ui) {
        $(".ui-dialog-titlebar-close span").html("×");
    }
});

次に、$.extend()を使用して、各ダイアログに特定のオプションを追加できます。

$(".another-dialog").dialog(
    $.extend({}, $(document).data("common-dialog-options"), {
        title: "Another dialog",
        buttons: [
            { text: "OK" },
            { text: "Cancel" }
        ]
    })
);
于 2011-08-12T15:02:27.083 に答える
0 
var defaultDialog = {
  title: 'Another dialog',
  autoOpen: false,
  draggable: true,
  modal: true,
  show: 'fade',
  hide: 'fade',
  width: 400,
  position: ['center', 'center'],
  buttons: [
    { text: 'Ok' },
    { text: 'Cancel' }
  ],
  open: function(event, ui) { $(".ui-dialog-titlebar-close span").html('×') }
};

var tunnedDialog= jQuery.extend(true, {}, defaultDialog );

tunnedDialog.title: 'Another dialog';
tunnedDialog.buttons: [
    { text: 'Ok' },
    { text: 'Cancel' }
  ]

$('.another-dialog').dialog(tunnedDialog);
于 2011-08-12T15:09:44.033 に答える