今回の記事では、JavaScriptでダイアログを出す方法を書いていきます。
JSのダイアログって、ボクみたいにインターネット歴が20年前後くらいの人間からすると結構怪しいものなんですよねｗ
ウィルス系とか、エロサイトとか見ると昔はよく出てきたイメージｗ
でも今はセキュリティとかも以前から比べると段違いにレベルアップしてるので、今はダイアログに対するイメージはそんなに悪くないですよね。
ということで、たぶんサイトで導入して便利に使いたい人もいると思いますので、多く使われるものの種類と方法を書いておきますね。
まず、基本的なダイアログ。
alert(‘表示させたい文字列・値’);
これで一般的なダイアログが出ます。
ちなみに、これは純粋なJavaScriptです。
次に、確認のダイアログ。
confirm(‘表示させたい文字列・値’);
これも純粋なJavaScriptです。
confirmのダイアログは「はい」「いいえ」のボタンがダイアログ内に表示され、基本的には「はい」を押すと処理が続行されるパターンのものが多いですね。
例えば、「はい」をクリックするとページ遷移したり、ページの再読み込みが始まったり、などなど。
もちろん、if文と絡めて「はい」「いいえ」の分岐をすることも可能です。
confirmは「はい」をクリックすると「true」、「いいえ」をクリックすると「false」という値が返されます。
true、falseで返されるものを「真偽値」というらしいのですがこういうパターンは他のプログラムでもよくあります。
なので分岐に使う場合は、
var hantei = window.confirm(‘よろしいですか？’);
if(hantei){
alert(‘結果はtrueです。’);
}else{
alert(‘結果はfalseです。’);
}
みたいな感じで書きます。
これでtrueだったらページAへ、falseだったらページBへ、みたいなページ誘導をさせたり、表示させる文字列を変えたり、まぁいろいろな処理ができます。
まぁ、頻繁に使うダイアログはこの2つなんですが、実はもう一つダイアログの関数があります。
それが「prompt」というものです。
これは、ユーザーに入力を求めるダイアログです。
ダイアログ内にテキストフォームが表示され、その中に入力させるものですね。
スクリプトの書き方は以下のようになります。
prompt(“ダイアログに入力してください”);
でもこちら、上の2つに比べてあまり使われませんね。
推測するに、formタグがあるからではないでしょうかね。
promptだとテキストフォームが1行だけに対し、formタグの場合はいろんな形でデータを入力することができるため、利便性が高いんですよね。
ログインにしたってIDとPWという2つを入力することで1つの入力よりもセキュリティを高めることもできるし。
まぁ、ボクは使ったことはありません。
使うケースが見つかりませんってのが本音ｗ
ということで、今回はJavaScriptで出せるダイアログのお話でした。
一応、今回話した3つのダイアログをまとめてデモ画面を作ったので、動作確認の参考にしてください。
今回は基本動作の説明でしたが、次はボクが使ってる使用例も含めて応用編も書いてみたいと思います！
では、また！
