タグ

2017年4月18日のブックマーク (2件)

  • ページ離脱防止のためにJavaScriptでアラートを表示する

    フォームの入力中に途中で離脱されないようにするには、アラートを出すことが効果的です。 ぼくは途中でよくフォーム入力を諦めることがあるのですが、アラートを出されるとたびたび引き止められて、ページを離脱するのを踏みとどまります。 なので個人的にはこのアラートはすごい力を持っていると思ってます。 ※このページにコードを仕込んであります。リロードしたりブラウザバックで戻ったりしてみてください。 beforeunloadイベントを使う ブラウザの window オブジェクトには onbeforeunload というイベントが用意されています。 このイベントハンドラに関数を設定すればよいのです。 window のリソースの unload 直前に発生するイベントに対応する処理を設定します。 文書が未だ可視状態であり、イベントが未だキャンセル可能 (event.preventDefault) なタイミング

    ページ離脱防止のためにJavaScriptでアラートを表示する
  • HTML5 の pushState/popState でヒストリバックを無効にする : まだプログラマーですが何か?

    HTML5 で追加された JavaScript の History API を使うと、ブラウザのヒストリ履歴(戻る/進む)の中身を操作できます。これを使って「戻る」を無効にしたページを作ってみます。jQuery を使うので、必要に応じてロードしておきます。 History API では pushState メソッドで履歴を1つ追加、popState メソッドで履歴を1つ(新しいものから)取り出します。この2つを組み合わせて、以下の様なロジックを実装しています: - ページロード時に強制的にニセの1つ履歴を追加 - そのページ内で「戻る」イベントが発生したら(追加したニセの履歴が取り出されるので)、再度ニセの履歴を1つ追加して処理を終了(return)する <script> // History API が使えるブラウザかどうかをチェック if( window.history && wind

    HTML5 の pushState/popState でヒストリバックを無効にする : まだプログラマーですが何か?