+JavaScript+画像認証コードの生成

#author("2019-11-06T12:52:55+08:00","default:Admin","Admin") .NET Framework

最新の14件

2014/03/21

FrontPage

2013/05/15

技術メモ

2013/05/13

バッチファイル(.bat)作成

2013/05/12

JavaScript

JavaScriptで画像認証コードを生成するサンプル

<html xmlns="http://www.w3.org/1999/xhtml" >
 <head id="Head1" runat="server"> 
    <title></title> 
 </head> 
<body onload="javascript:makeCode('CheckHere',5)"> 
   <form id="form2" runat="server"> 
   <div> 
   <input type="text" id="Code" value=""/><tt id="CheckHere"></tt><a href="javascript:makeCode('CheckHere',5)">見えない</a>？
<br/>
<input type="button" value="検証" onclick="check2Code();"/>
</div>
   </form> 
</body> 
</html> 
<script language="JavaScript" type="text/JavaScript">
   //認証コード
   function check2Code() {
       if (document.getElementById("Code").value != CheckCode) {
           alert("違う！");
       } else alert("^o^");
   }

   var CheckCode; //認証するコード

   function makeCode(objID, N) {
       //objID = 検証エリアのID
       //N = 認証コードの長さ
       var picURL;   //コード画像のパス
       var radCode;
       var CodeHTML;
       var i;
       CheckCode = "";
       picURL = "Images/";
       CodeHTML = "&nbsp;&nbsp;";
       //ランダムで数字画像を命名する場合（推奨）
       for (i = 0; i < N; i++) {
           radCode = Math.random() * 10;
           if (radCode < 1) { CheckCode = CheckCode + 0; CodeHTML = CodeHTML + '<img src="' + picURL + 'asdfasd.jpg"/>'; }
           else if (radCode < 2) { CheckCode = CheckCode + 1; CodeHTML = CodeHTML + '<img src="' + picURL + '22asd8.jpg"/>'; }
           else if (radCode < 3) { CheckCode = CheckCode + 2; CodeHTML = CodeHTML + '<img src="' + picURL + 'kdk9i22.jpg"/>'; }
           else if (radCode < 4) { CheckCode = CheckCode + 3; CodeHTML = CodeHTML + '<img src="' + picURL + 'kkkkkk0.jpg"/>'; }
           else if (radCode < 5) { CheckCode = CheckCode + 4; CodeHTML = CodeHTML + '<img src="' + picURL + '00...4.jpg"/>'; }
           else if (radCode < 6) { CheckCode = CheckCode + 5; CodeHTML = CodeHTML + '<img src="' + picURL + '88azx.jpg"/>'; }
           else if (radCode < 7) { CheckCode = CheckCode + 6; CodeHTML = CodeHTML + '<img src="' + picURL + '8dfgdfnj_34j.jpg"/>'; }
           else if (radCode < 8) { CheckCode = CheckCode + 7; CodeHTML = CodeHTML + '<img src="' + picURL + 'asdjfk--=1.jpg"/>'; }
           else if (radCode < 9) { CheckCode = CheckCode + 8; CodeHTML = CodeHTML + '<img src="' + picURL + 'dsfjasdkf8_sd0.jpg"/>'; }
           else { CheckCode = CheckCode + 9; CodeHTML = CodeHTML + '<img src="' + picURL + 'bbxv_ff.jpg"/>'; }
       }
       
       //ある規約で数字画像を命名する場合
       /*
       for(i=0;i<N;i++)
       {
       radCode=Math.floor(Math.random()*10);
       CheckCode = CheckCode + radCode;
       CodeHTML = CodeHTML + '<img src="' + picURL +'img'+ radCode +'.jpg"/>';
       }
       */
       //画像を検証エリアに挿入する
       document.getElementById(objID).innerHTML = CodeHTML;
   }
</script>

iディレクトリで複数のポータルサイトにディレクトリ登録

コメント：