【jQuery】フォームへの再入力時にペーストを禁止する方法。

Ads by Google

入力フォームでメールアドレスを記述してもらう際に、間違いを防止するため、確認用に2度入力させることが良くあリます。
そんなとき、1つ目に入力したものをコピーして2つ目にペーストされてしまうと、瞬間的には入力の手間が減ったかのように感じますが、間違い防止にはなりません。

このようなことを防止するために、jQuery を使ってペーストを禁止する方法を紹介します。

基本的には、拡張子が「.js」のファイルを用意して、以下のコードを記述するだけです。

$(document).on('paste','input[type=email]',function(){
return false;
});

jQuery 本体をダウンロード&リンクさせることも忘れずに。

また、jQueryを使わずとも、html でフォームのインプット要素、該当部分に、「oncopy」、「onpaste」、「oncontextmenu」を追加することでも実装可能です。
こちらのほうが簡単かもしれませんね。

<input type="text" oncopy="return false" onpaste="return false" oncontextmenu="return false" />
  • onCopy:コピーをしたときの動作。
  • onPaste:ペーストをしたときの動作。
  • onContextmenu:右クリックメニューを出そうとしたときの動作。

これらを、それぞれ無効にしています。

パスワードの入力部分で type="password" を使用している場合は、コピーはできないのでonCopy、onContextmenuを指定する必要はありません。
また、*や●で入力したパスワードが隠されるため、テキストエディタでパスワードを入力したものをコピーして、入力フォームにペーストする人もいるので、onPaste="return false" を使用するのは不要かもしれません。
臨機応変に使い分けてみてください。

こちらの記事もいかがですか?

アナタにオススメ!
同じカテゴリーの他の記事です。

Ads by Google

Leave a Replyコメントを残す

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