ベストアンサー

フォームで「パスワード（確認用）」をコピペ不可に…

2012/01/11 07:11

メールフォームで、「パスワード」と「パスワード（確認用）」の２つがあることがよくありますが、サイトによっては、「パスワード（確認用）」のところでコピペをしようとしてもできないようにしているケースがありますよね。これはどうやって実現しているのでしょうか？以上、よろしくお願い申し上げます。

goo_mygwdisk_1
お礼率6% (24/395)

JavaScript
回答数1
ありがとう数0

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

LancerVII
ベストアンサー率51% (1060/2054)

2012/01/11 08:55 回答No.1

こんにちは。方法はいろいろあると思いますがJQueryというライブラリを利用すれば簡単に実現できます。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>フォームで「パスワード（確認用）」をコピペ不可に…</title> <style type="text/css"> #errmsg { position:relative; top:-25px; left:90px; display:none; width:200px; border:solid 1px #f00; color:#f00; background-color:#ffc; font-size:80%; padding:5px; } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $().ready ( function () { // ID:pass2のペーストイベントにバインド $('#pass2').bind('paste', function (e) { // イベントを止める(ココではペースト) e.preventDefault(); // ここはメッセージ表示なので直接関係ありません $('#errmsg').html ( "貼り付けは使用しないで下さい" ); $('#errmsg').fadeIn('slow',function() { $('#errmsg').fadeOut('slow')}); }); }); </script> </head> <body> <form id="frm-test"> 貼り付け可能:<input type="password" name="pass1" id="pass1" /><br /> 貼り付け不可:<input type="password" name="pass2" id="pass2" /><div id="errmsg"></div> </form> </body> </html>

ログインすると、全ての回答が全文表示されます。