alert、confirmの使い方
Webアプリを作っていると、ユーザーに処理を中断してメッセージを表示したり、何か確認を促したい時があります。
入力に不備があることを伝えたり、操作を確定して問題ないかどうかなどの時ですね。
そんな時に使えるのがJavaScriptの標準関数であるalertとconfirmです。
alertの使い方
JavaScript
alert('名前を入力してください')
上記のように書けば、そこが動いたタイミングで画像のようにポップアップが表示されます。簡単ですね。
表示したい文字はalert関数の引数として渡すだけです。
alertではOKボタンが一つ配置されており、それを押すと後続の処理が動きます。
confirmの使い方
alertではポップアップでメッセージを表示するだけでした。
ただ、場合によってはメッセージを表示した後に処理をキャンセル可能にしたい場合もあるかと思います。
そんな時にはconfirmを使います。
JavaScript
if (confirm('データを削除します。よろしいですか？')) {
document.write('処理を続行します')
}
else {
document.write('処理を中断します')
}
alertと同じようにconfirm関数の引数に表示したい文字列を渡します。
confirmには戻り値があります。
OKボタンを押せばtrueが返り、キャンセルボタンを押せばfalseが返ります。
なので上記のソースコードではif文で処理を分岐させており、OKボタンが押された時に「処理を続行します」と画面に表示し、キャンセルボタンが押された時は「処理を中断します」と表示するようになっています。
OKボタンが押された場合
キャンセルボタンが押された場合
まとめ
簡単ですが、本当に簡単なので以上になります。
とりあえずalertとconfirmを使えばユーザーがWebを操作している途中で注意を促すことができます。
ただ、最近のモダンなWebでは画面を薄暗くして真ん中にふわっと画面が浮き出てくる「モーダル」や、画面の端っこからスッとメッセージが表示される「トースト」を活用していることがあります。
これらの作り方についても後ほど紹介したいと思います。
したっけ！
- alertはユーザー操作を中断してメッセージをポップアップ表示させるもの
- confirmも同じだがこちらは処理をキャンセルさせることができる
本格的にプログラミングを学びたいですか？ITのエンジニアになりたいですか？
IT業界は万年人手不足であり、ニーズがあります。
パソコンとインターネットがあれば場所を問わず仕事ができるので、リモートワークが普及しつつある現代にマッチした職種と言えると思いますし、
物理的に必要なものはパソコンぐらいなので初期投資にかかる費用も少なく、人並みに仕事ができればフリーランスになって会社依存を脱却することもできます。
身につけた技術は一生モノです。
もし本腰を入れて勉強したいという方はスクールに入るのも一つの手です。
いくつか紹介しますので、興味があればサイトを覗いてみてください。
TechAcademy
最短4週間で未経験からプロを育てるオンライン完結のスクールです。 どこかに通う必要なく、自宅でもプログラミングやアプリ開発を学ぶことができます。
TechAcademyのサイトへ
Want to learn programming in earnest? Want to be an IT engineer?
The IT industry is understaffed for many years and has needs.
If you have a computer and the Internet, you can work anywhere,
so I think it can be said that it is a job type that matches the present age when remote work is becoming widespread.
The initial investment cost is low, and if you can work like a normal person, you can become freelance and get rid of your dependence on the company.
The skills that you have acquired is something that will last a lifetime.
If you want to study in earnest, you can go to school.
I will introduce some of them, so if you are interested, please take a look at the site.
DMM WEBCAMP
This is a programming school for those who are serious about changing jobs. guarantee a job change, so it is recommended for those who are inexperienced and are looking for a job change in the IT industry!
move to DMM WEBCAMP
TechAcademy
It is an online school that trains professionals from inexperienced in a minimum of 4 weeks. You can learn programming and app development at home without having to go anywhere.
move to TechAcademy