AJAX 實時讀取輸入文本(php)
更新時間：2009年11月27日 17:04:01 作者：
客戶端String.php,服務器端String_check.php，很簡單的實現(xiàn)。
客戶端代碼：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
</head>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function sendRequest(){
createXMLHttpRequest();
var name = document.getElementById("name").value;
url = "String_check.php?page="+name;
xmlHttp.onreadystatechange = callback;
xmlHttp.open('GET',url,true);
xmlHttp.send(null);
}
function callback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
document.getElementById("show").innerHTML = "您輸入的字符串為："+ xmlHttp.responseText;
}
}
}
</script>
<body>
<p>AJAX test;</p>
<p><br/>
<input type="text" id="name" onkeyup="sendRequest();" />
<br/>
<span id="show"></span>
</p>
</body>
</html>
服務器端代碼：
<?php
header('Content-type: text/html;charset=GB2312');
$ename = $_GET["page"];
if ($ename == "") {
$ename = "請輸入：";
}
echo ($ename);
exit(0);
?>
復制代碼 代碼如下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
</head>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function sendRequest(){
createXMLHttpRequest();
var name = document.getElementById("name").value;
url = "String_check.php?page="+name;
xmlHttp.onreadystatechange = callback;
xmlHttp.open('GET',url,true);
xmlHttp.send(null);
}
function callback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
document.getElementById("show").innerHTML = "您輸入的字符串為："+ xmlHttp.responseText;
}
}
}
</script>
<body>
<p>AJAX test;</p>
<p><br/>
<input type="text" id="name" onkeyup="sendRequest();" />
<br/>
<span id="show"></span>
</p>
</body>
</html>
服務器端代碼：
復制代碼 代碼如下:
<?php
header('Content-type: text/html;charset=GB2312');
$ename = $_GET["page"];
if ($ename == "") {
$ename = "請輸入：";
}
echo ($ename);
exit(0);
?>
您可能感興趣的文章:
相關文章
下面小編就為大家?guī)硪黄趂ileUpload文件上傳帶進度條效果的實例(必看)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
AJAX開發(fā)技術在PHP開發(fā)中的簡單應用技巧
AJAX無疑是2005年炒的最熱的Web開發(fā)技術之一，當然，這個功勞離不開Google。我只是一個普通開發(fā)者，使用AJAX的地方不是特別多，我就簡單的把我使用的心得說一下。（本文假設用戶已經(jīng)具有JavaScript、HTML、CSS等基本的Web開發(fā)能力）2010-04-04
這篇文章主要介紹了Ajax異步方式實現(xiàn)登錄與驗證，感興趣的小伙伴們可以參考一下2015-12-12![[asp]天楓AJAX blog V1.0 程序提供下載了](http://img.jbzj.com/images/xgimg/bcimg3.png)
[asp]天楓AJAX blog V1.0 程序提供下載了...2007-09-09
我們通過一個ASP.NET MVC應用來重現(xiàn)IE針對Ajax請求結果的緩存。在一個空ASP.NET MVC應用中我們定義了如下一個默認的HomeController，其中包含一個返回當前時間的Action方法GetCurrentTime。2015-09-09
這篇文章主要為大家詳細總結了基于ajax html實現(xiàn)文件上傳技巧,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
Ajax讀取數(shù)據(jù)之分頁顯示篇實現(xiàn)代碼
前幾篇的ajax教程里講了，讀取，添加，修改，刪除的功能．有幾天沒有更新了，雖然網(wǎng)上也有很多ajax分頁的教程和相關實例．2010-10-10
好用的AJAX類代碼分享，需要的朋友可以參考下。2011-11-11
javascript的編碼是和myeclipse一樣的為什么還會出現(xiàn)問題，下面為大家介紹下ajax的responseText亂碼的問題的解決方法2014-05-05
在網(wǎng)上Google了很多次,能找到用rails制作rss,但是總是找不到完整的。今天把完整的過程抄錄在這里2008-09-09