jQueryダイアログボックスについてまとめてみました

使ってこなかったなんて、なんてもったいない…

ほとんど確認用で「alert」しか使ったことが
なかったのですが、調べたらダイアログは
3種類もあって、今まで損をしていたなと
後悔しています…。

alert
confirm
prompt

アラート文を表示するだけの「alert」、
OKかキャンセルかを選択させる「confirm」、
ユーザーに何かを入力させる「prompt」。

あらためてJavaScript標準で使えると
考えたら、すごく便利ですね。

XHTML、CSS、jQuery、PHP、Rubyは体系的に勉強したものの、
考えてみたらJavaScriptだけ、
必要に応じてその都度、学んでいるという状況でした。
やっぱりまとまった勉強は必要だとあらためて
感じたので、ちょっと図書館で本を取り寄せます。

まとめると、それぞれの機能は以下のようになりました。

alert(“here!”);
→　ユーザーはOKを押すだけ。

confirm(“進む？　やめる？　\n改行の場合。\n\tタブで字下げの場合。”);
→　OKでtrue、キャンセルかXでfalseを返す。

prompt(“入力をうながすメッセージ”,”入力欄の初期値”);
→　キャンセルまたはXが押されるとnullが返る。

ちなみに、JavaScriptでは
windows.alert
windows.confirm
windows.propmt

とwindows.が必要でしたが、jQueryでは不要です。
すっきり書けて、やっぱりjQueryは良いですね。

IE9でちょっと試したのですが、
IEの入力ダイアログのデザインが情けない…。
しかも画面左上に出てしまいます。

jQueryプラグインのダイアログを作成している人も
たくさんいます。
便利だけれど、ブラウザ標準のデザインが
そっけなさ過ぎて、我慢ならない人が多いのでしょうね。

ウェブアプリを開発するにあたって、
confirmは特に素敵ですね。
「削除」や「更新」の確認にもってこいです。
もちろんそれだけではありませんが。
JavaScriptだといまひとつ複雑だったのですが、
jQueryで書いてAjaxでやれば、
確認用の画面を作る必要がないのが素晴らしい。
これからはダイアログをもっと活用していきます。