2011年9月24日土曜日

[JavaScript]ブラウザ上でペーストを禁止する

会員登録フォームなどで、メールアドレスを入力させる場合、確認のために同じメールアドレスを2度入力させるのをよく見かけます。

そのような場合、「確認用はコピー&ペーストではなく直接入力でお願いいたします。」などと注意書きが入れてあったりするのですが、こういうった注意書きがある場合でも、実際にはコピー&ペーストできてしまうフォームがあったりします。

そこで、こういったフォームでJavaScriptを利用してコピー&ペースト(Ctrl-c & Ctrl-s)を防止する方法を紹介します。

コピー禁止フォーム:

ペースト禁止フォーム:


上記が実際の動作のイメージです。コピー&ペーストが出来なくなっている事を確認いただけると思います。
方法はいたって、簡単です。

  1. コピー元フォームをコピー禁止にする。
    コピーを禁止するには
    <input type="text" name="from" value="" size="40" maxlength="120" oncopy="return:false;">
    
    というようにoncopyで何もしないようにします。
  2. ペースト先フォームをペースト禁止にする。
    ペーストを禁止するには
    <input type="text" name="to" value="" size="40" maxlength="120" onpaste="return:false;">
    
    というようにonpasteで何もしないようにします。

2 件のコメント:

  1. 当方はコピペツールを使って自分のメールアドレスを
    入力している為このような機能は迷惑なだけです。
    (いちいち手入力していては手間と間違いの元です。
    入力間違いを防ぐ為ということでこのような機能を
    つけるのは本末転倒だと思います。)

    因みにFirefoxでの解除の方法。
    (Greasemonkeyのplug-inがインストールされている事が前提)
    http://q.hatena.ne.jp/1301470823

    返信削除
  2. たとえば、エクセルのセルをコピーしてそれを貼り付けようとすると、とんでもコードで貼り付けられるようなことがたまにあって、
    それが元で挙動がおかしくなってしまうような事例は割とあって、そういうの調べるのコストもかかって面倒なのでコピペ禁止にするようなことはよくあります。

    返信削除