jqueryダイアログの確認ボックスを作成しようとしています。以下の場合、「クリックして確認ボックス」をクリックすると、ダイアログボックスが表示されます。これは、ユーザーが[OK]または[キャンセル]を選択すると消え、どのボタンが押されたかに関する情報を呼び出し元の関数に渡します。
基本的に、次の変更を加えて、別のソリューションから以下のコードをコピーして貼り付けました。別の関数内からmyConfirmを呼び出します。この関数は、「clickfor..」がクリックされたときに呼び出されます。ページが読み込まれたときにダイアログボックスを表示したいだけではありません(これは、私が見たほとんどの例の場合のようです)。その結果、ダイアログボックスはまったく表示されません。また、スクリプトでmyConfirmを直接呼び出すと、ボタンを押しても閉じません。「破壊」ではなく「閉じる」を試しました
html
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="/resources/demos/external/jquery.bgiframe-2.1.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
</head>
<a id = "confirm"> click for confirm box</div>
脚本
<script>
function myConfirm(dialogText, okFunc, cancelFunc, dialogTitle) {
$('<div style="padding: 10px; max-width: 500px; word-wrap: break-word;">' + dialogText + '</div>').dialog({
draggable: false,
modal: true,
resizable: false,
width: 'auto',
title: dialogTitle || 'Confirm',
minHeight: 75,
buttons: {
OK: function () {
if (typeof (okFunc) == 'function') { setTimeout(okFunc, 50); }
$(this).dialog('destroy');
},
Cancel: function () {
if (typeof (cancelFunc) == 'function') { setTimeout(cancelFunc, 50); }
$(this).dialog('destroy');
}
}
});
}
$('[id=confirm]').click(function () {
myConfirm( 'Do you want to delete this record ?',
function () {
alert('You clicked OK');
},
function () {
alert('You clicked Cancel');
},
'Confirm Delete'
);
});
</script>