「window.alert」や「window.confirm」ではなくcssを利用したモーダルウィンドウでメッセージ表示

怒り

「window.alert」や「window.confirm」はなるべく避けよう

以前記事にした『「このページにこれ以上メッセージの作成を許可しない」へのチェックは要注意』。

JavaScriptの「window.alert」や「window.confirm」などでポップアップでメッセージを表示させた際に一部ブラウザでは「このページにこれ以上メッセージの作成を許可しない」というチェックボックスが現れ、これにチェックをしてしまうと、当該サイトの別ページなどでポップアップメッセージが表示されず、システムの処理によってはページ遷移ができなくなってしまう事象に陥ります。

IE警告
Windows10搭載のIE11

以前の記事では根本解決は難しいと書きましたが、「window.alert」や「window.confirm」でメッセージ表示をしない方法での解決方法がありそう。

cssを使用したモーダルウィンドウ

その方法はcssやJavaScript(またはJQuery)を利用してモーダルウィンドウでメッセージを表示する方法です。

この方法であれば、ブラウザメッセージという形での表示ではないため、ブラウザが独自に変な制御をしてくることはないはずです。

若干デザインの検討であるとかcssの定義など対応しなければならないところはありますが、サイトデザインの面でもこれからの流れかなと思います

ここでその方法を紹介すると長くなるので、いくつかサイトをご案内します。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です