システムダイアログボックスではなく、HTMLで独自にダイアログボックス風のページや
レイヤー形式のダイアログを実装する場合はこちらの記事を参照してください。
JavaScriptで確認ダイアログを表示するコードを紹介します。
JavaScriptで確認ダイアログを表示させるには、windowオブジェクトの confirm()メソッドを利用します。
confirm()メソッドでは確認のためのダイアログボックスを表示できます。表示されるダイアログボックスはモーダルウィンドウとして表示されます。ダイアログボックスを閉じないとウィンドウ操作を続行することはできません。
[OK]ボタンがクリックされると、trueが、[キャンセル]ボタンがクリックされると、falseが戻ります。
下記のコードを記述します。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<script>
function onLinkClick() {
var ret = window.confirm('処理を続行してよろしいですか？');
var obj = document.getElementById("message");
if (ret == true) {
obj.innerText = "処理を実行";
} else {
obj.innerText = "処理を中止";
}
}
</script>
</head>
<body>
<a href="javascript:void(0);" onclick="onLinkClick();">処理</a>
<div id="message"></div>
</body>
</html>
上記のHTMLファイルをWebブラウザで表示します。下図の画面が表示されます。
ページの[処理]リンクをクリックすると、下図の確認ダイアログが表示されます。
確認ダイアログで[OK]ボタンをクリックすると、画面に"処理開始"のメッセージが表示されます。
一方、確認ダイアログで[キャンセル]ボタンをクリックすると、画面に"処理中止"のメッセージが表示されます。
