2

常にページ上に要素を持ち、そこからダイアログを作成する必要はなく、JavaScriptでモーダルコンテンツを定義する方法はありますか?

タイトルオプションがあるので、「動的に」モーダルタイトルを作成できますが、実際のコンテンツはどうですか?「画像#539を削除します」と言う必要があります。考えられるすべての画像に対してモーダルを作成するのではなく、要素を作成してそこからダイアログを作成することもできます。

より良い方法が必要です。

4

3 に答える 3

5

あなたはこのようなことを試すことができます:

HTML

<button id='diag1'>First dialog</button>
<button id='diag2'>Second dialog</button>

Javascript

var diag = $('<div id="myDialog" title="Testing!"><span id="dialogMsg"></span></div>');

diag.dialog({
    autoOpen: false,
    modal: true
});

$('#diag1').click(function() {
    $('#dialogMsg').text("Message for dialog 1.");
    diag.dialog("open");
});

$('#diag2').click(function() {
    $('#dialogMsg').text("Message for dialog 2");
    diag.dialog("open");
});

ここでデモ。

于 2010-12-05T05:35:57.910 に答える
3

もう1つの解決策は、もう少し動的です。

function showError(errorTitle, errorText) {

    // create a temporary place to store our text
    var window = $('<div id="errorMessage" title="' + errorTitle + '"><span id="dialogMsg">' + errorText + '</span></div>');

    // show the actual error modal
    window.dialog({
        modal: true
    });
}

次に、エラーモーダルを呼び出す必要がある場合は、次のようにします。

showError("Error-Title", "Error message here");

関数にさらにパラメータを追加して、幅や高さなどを制御することを想像できます。

楽しみ!

于 2011-02-25T18:08:17.650 に答える
0

スコットありがとう。ダイアログのタイトル属性を追加しました:

..。

var diag = $('<div id="myDialog" title=""><div id="dialogMsg"></div></div>');

..。

$('#diag1').click(function() {
    $('#dialogMsg').html('<div class="dialog-body">Message for dialog 1</div>');
    $("#myDialog").dialog({title: 'Dialog Title 1'});
    diag.dialog('open');
});

デモ

于 2014-11-17T08:38:16.203 に答える