利用iframe實現區域性重新整理
阿新 • • 發佈：2019-01-26
利用iframe來實現註冊
1.reg.html
2.doreg.php<!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" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title></title> </head> <body> <form action="reg.php" method="post"> <ul> <li><label for="">使用者名稱：</label><input type="text" name="username" id="username"> <span id="message"></span></li> <li><label for="">密 碼：</label><input type="password" name="password"></li> <li><label for=""> </label><input type="submit" value="註冊"></li> <iframe src="" frameborder="0" width="0" height="0" id="ifr"></iframe> </ul> </form> <script type="text/javascript"> var username = document.getElementById("username"); var ifr = document.getElementById("ifr"); //繫結失去焦點事件 username.onblur = function(){ //向iframe發出請求，實際上就是設定其src屬性 ifr.src = "doreg.php?username="+username.value; } </script> </body> </html>
效果如下：<?php //獲取使用者名稱 $username = $_GET['username']; // 對使用者名稱進行檢測，檢視是否可用，只需要連線資料庫並查詢即可 $message = ""; if ($username == "admin"){ $message = "對不起，該使用者已被佔用！"; } else { $message = "恭喜您，該使用者名稱可用！"; } //在子頁面中編寫js程式碼操作父頁面，通過php輸出一段js程式碼 echo <<<STR <script type="text/javascript"> window.parent.document.getElementById("message").innerHTML = "$message"; </script> STR;
