如何在登入頁面引入驗證碼檔案並顯示
上一章介紹如何製作一個簡單的驗證碼，把驗證碼的php檔案定義為：captcha.php
現(xiàn)在我們來說一說如何引入驗證碼文件，初始我們的登入頁面是這樣的：
這裡的驗證碼是這樣的。
在login.html 檔案中的程式碼如下：
<div class="form-group"> <div class="field"> <input type="text" class="input input-big" name="code" placeholder="填寫右側的驗證碼" data-validate="required:請?zhí)顚懹覀鹊尿炞C碼" /> <img src="images/passcode.jpg" alt="" width="100" height="32" class="passcode" style="height:43px;cursor:pointer;" onclick="this.src=this.src+'?'"> </div> </div>
這裡我們需要對這段程式碼進行一些修改，引入驗證碼文件，修改後的程式碼如下
<div class="form-group">
<div class="field">
<input type="text" class="input input-big" name="code" placeholder="填寫驗證碼" data-validate="required:請?zhí)铗炞C碼" />
<a style="float:right; padding:5px;" href="javascript:;" onclick="document.getElementById('captcha_img').src='captcha.php?r='+Math.random()">
<img id="captcha_img" class="passcode" border='1' src='captcha.php?r=echo rand(); ?>' style="width:100px; height:42px" />
</a>
</div>
</div>然後對css樣式進行一些修改。這裡使用了javascript中的HTML DOM Document 對象，並引用了captcha.php的驗證碼所產(chǎn)生的圖片。
執(zhí)行程式碼後實現(xiàn)的效果：
