js生成十六進制隨機數

登陸驗證碼實現：登陸頁面（php）生成16進制隨機數，並帶着隨機數到valcode.php頁面生成驗證碼

<?php
　　if(isset($_SESSION)){session_start();}
　　include_once 'conn/conn.php';
　　for($i=0;$i<4;$i++){
　　	$num= dechex(rand(0,15));//生成16進制隨機數
　　}
?>
<p>
<span>用戶名:
    <input id="lgname" type="text" style=" width: 75px; height: 16px; border: 1px #999999 solid;" />
      </span><br />
      <span>密  碼：
      <input id="lgpwd" type="password" style=" width:75px; height: 16px; border: 1px #999999 solid;" />
      </span><br />
      <span>驗證碼：
      <input id="lgchk" type="text" style=" width: 75px; height: 16px; border: 1px #999999 solid;" />
      </span><br /> 
  <span>
      <img id='chkid' src="./valcode.php?num=<?php echo $num; ?>" width="55" height="18" /> 
      <a id="changea" style="cursor:hand;">看不清</a>
  </span>
</p>
<div style="  height: 25px; line-height: 25px;">
    <input id="chknm" name="chknm" type="hidden" value="<?php echo $num; ?>"/>
    <a id="lgbtn" style=" color:#f0f0f0;">登錄</a> 
    <a id="reg" style=" color:#f0f0f0;">注冊</a> 
    <a id="foundbtn" style=" color:#f0f0f0;">找回密碼</a>
    </div>
</div>

 當點擊“看不清”的時候，從用戶體驗效果出發，需要使用JavaScript無刷新生成驗證碼；但是使用JavaScript生成十六進制隨機數，稍有些復雜。JavaScript中不能直接將十進制數轉為十六進制，需要手動進行轉換。首先使用Math.random()函數生成0～15之間的隨機數，然后使用Math.ceil()函數將隨機數取整，接下來就要逐次判斷該值，如果該值大於9，那么將10～15的數一一對應轉換為a、b…，一直到f。轉換完成后，將值累加，最后傳給valcode.php頁。

使用JavaScript生成十六進制隨機數的完整代碼如下：

//生成隨機數
    function showval(){
        num = '';
        for(i=0;i<4;i++){//循環輸出四位驗證碼
            tmp =  Math.ceil((Math.random() * 15));//取出一位十六進制的整數
            if(tmp > 9){//依次判斷隨機數
                switch(tmp){
                    case(10)://如果隨機數等於10，換為a
                        num += 'a';
                        break;
                    case(11):
                        num += 'b';//如果隨機數等於11，換為b
                        break;
                    case(12):
                        num += 'c';//如果隨機數等於12，換為c
                        break;
                    case(13):
                        num += 'd';//如果隨機數等於13，換為d
                        break;
                    case(14):
                        num += 'e';//如果隨機數等於14，換為e
                        break;
                    case(15):
                        num += 'f';//如果隨機數等於15，換為f
                        break;
                }
            }else{
                num += tmp;
            }
        }
        $('chkid').src='valcode.php?num='+num;//將生成的隨機數傳給圖像生成頁
        $('chknm').value = num;//將隨機數的值保存到頁面的隱藏域中
    }

 附上圖像生成頁代碼（實現的功能是驗證）

//生成隨機數
    function showval(){
        num = '';
        for(i=0;i<4;i++){//循環輸出四位驗證碼
            tmp =  Math.ceil((Math.random() * 15));//取出一位十六進制的整數
            if(tmp > 9){//依次判斷隨機數
                switch(tmp){
                    case(10)://如果隨機數等於10，換為a
                        num += 'a';
                        break;
                    case(11):
                        num += 'b';//如果隨機數等於11，換為b
                        break;
                    case(12):
                        num += 'c';//如果隨機數等於12，換為c
                        break;
                    case(13):
                        num += 'd';//如果隨機數等於13，換為d
                        break;
                    case(14):
                        num += 'e';//如果隨機數等於14，換為e
                        break;
                    case(15):
                        num += 'f';//如果隨機數等於15，換為f
                        break;
                }
            }else{
                num += tmp;
            }
        }
        $('chkid').src='valcode.php?num='+num;//將生成的隨機數傳給圖像生成頁
        $('chknm').value = num;//將隨機數的值保存到頁面的隱藏域中
    }

 當頁面第一次被載入時，將PHP頁面生成的16進制數帶到valcode.php生成驗證碼；當驗證碼中帶有干擾串用戶看不清，可以單擊首頁中“看不清”時，是使用showval函數生成的驗證碼；

if($('lgchk').value == ''){
　　alert('請輸入驗證碼');
　　$('lgchk').select();
　　return false;
}
if($('lgchk').value != $('chknm').value){
　　alert('驗證碼輸入錯誤');
　　$('lgchk').select();
　　return false;
}

 這里驗證的是驗證碼上的數字和隱藏域中的數字；