.net column
.NET開発者のためのブログメディア

JavaScriptでのconfirmメソッドの使い方とは?基本的な使い方からBootstrapと組み合わせた活用方法も紹介!

 
JavaScriptでのconfirmメソッドの使い方とは?基本的な使い方からBootstrapと組み合わせた活用方法も紹介!
SE
JavaScriptのconfirmメソッドはどのような機能を持っているのですか。
PM
confirmメソッドを使うと確認ダイアログボックスが表示され、ボタンの選択内容に応じて条件分岐できます。Bootstrapと組み合わせると洗練されたデザインになります。

JavaScriptでのconfirmメソッドの使い方とは?


今回は、JavaScriptでのconfirmメソッドの使い方について説明します。confirmメソッドを使うと、確認ダイアログボックスが表示されます。ボタンの選択内容に応じて処理を振り分けることができます。

JavaScriptでのconfirmメソッドの使い方に興味のある方はぜひご覧ください。

基本的な使い方

JavaScriptでのconfirmの基本的な使い方を紹介します。ソースコードを見てみましょう。

実行結果は以下のようになります。

See the Pen
JavaScript_confirm1
by kskumd (@kskumd)
on CodePen.

OK・キャンセル時の処理

JavaScriptではconfirmの戻り値で条件分岐できます。ソースコードを見てみましょう。

実行結果は以下のようになります。

See the Pen
JavaScript_confirm2
by kskumd (@kskumd)
on CodePen.

変数や改行

JavaScriptでのconfirmのメッセージは改行したり、変数を使用したりできます。ソースコードを見てみましょう。

実行結果は以下のようになります。

See the Pen
JavaScript_confirm3
by kskumd (@kskumd)
on CodePen.

form

JavaScriptでのform送信時のconfirmについて紹介します。ここでは、送信先がないので「type=”button”」としています。ソースコードを見てみましょう。

実行結果は以下のようになります。

See the Pen
JavaScript_confirm4
by kskumd (@kskumd)
on CodePen.

Bootstrap

JavaScriptでのBootstrapを使ったconfirmについて紹介します。ソースコードを見てみましょう。

実行結果は以下のようになります。Bootstrapを利用することで、洗練されたデザインになります。

See the Pen
JavaScript_confirm5
by kskumd (@kskumd)
on CodePen.


SE
cconfirmメソッドをBootstrapと組み合わせると洗練されたデザインになりますね。
PM
その通りです。ぜひ活用してみてください。

まとめ

いかがでしたでしょうか。JavaScriptでのconfirmメソッドの使い方について説明しました。confirmメソッドを使うと、確認ダイアログボックスが表示されます。ボタンの選択内容に応じて処理を振り分けることができます。

また、Bootstrapと組み合わせると、洗練されたデザインになります。ぜひご自身でソースコードを書いて、理解を深めてください。


.NET分野でのキャリアアップをお考えの方は、現在募集中の求人情報をご覧ください。

また、直接のエントリーも受け付けております。

エントリー(応募フォーム)

Search

Popular

reccomended

Categories

Tags