as 5a3i: 【JavaScript】確認ダイアログ表示

ユーザにフォームの入力をしてもらい、最後に確認をしたいとき、
JavaScriptでダイアログ表示を行うとよい。

以下の入力フォームでボタンが押されたら
入力内容を確認するようなダイアログを実装してみよう。

--フォームの実装--
<body>
<span>入力してね</span>
<form name="form1">
<input type="text" name="text1" id="text1">
<input type="button" value="ボタン" onClick="check();">
</form>
</body>

onClick="check();"⇒ ボタンを押したらcheck()がスタート。
check()内の処理のイメージとしては
①"内容はこんな感じでいいかな？"的メッセージを表示
②OKを押したら"内容変更しました"的メッセージを表示
③キャンセルなら何もせずダイアログを閉じる
それでは実装。

--JavaScriptの実装--
<script>
function check(){
var text1 = document.getElementById("text1").value;
var res = confirm("入力内容は「" + text1 + "」で良いでしょうか？");

if(res == true){
// OKを選択したときの処理
alert("変更しました。");
}
}
</script>

confirm()の時点でダイアログを表示してくれて、
リアクションがOK(true)なら~、キャンセル(false)なら~って感じでいけるんですね。
らくちん、らくちん。

as 5a3i

2012年6月22日金曜日

【JavaScript】確認ダイアログ表示

0 件のコメント:

コメントを投稿