AJAX 實時讀取輸入文本(php)
更新時間:2009年11月27日 17:04:01 作者:
客戶端String.php,服務(wù)器端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>無標(biāo)題文檔</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>
服務(wù)器端代碼:
<?php
header('Content-type: text/html;charset=GB2312');
$ename = $_GET["page"];
if ($ename == "") {
$ename = "請輸入:";
}
echo ($ename);
exit(0);
?>
復(fù)制代碼 代碼如下:
<!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>無標(biāo)題文檔</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>
服務(wù)器端代碼:
復(fù)制代碼 代碼如下:
<?php
header('Content-type: text/html;charset=GB2312');
$ename = $_GET["page"];
if ($ename == "") {
$ename = "請輸入:";
}
echo ($ename);
exit(0);
?>
您可能感興趣的文章:
- php+ajax實時刷新簡單實例
- php+ajax實時輸入自動搜索匹配的方法
- 值得分享的php+ajax實時聊天室
- PHP實現(xiàn)的消息實時推送功能【基于反ajax推送】
- PHP Ajax實現(xiàn)表格實時編輯
- PHP+Ajax實時自動檢測是否聯(lián)網(wǎng)的方法
- php+ajax實現(xiàn)無刷新動態(tài)加載數(shù)據(jù)技術(shù)
- php采用ajax數(shù)據(jù)提交post與post常見方法總結(jié)
- ajax處理php返回json數(shù)據(jù)的實例代碼
- php+jQuery ajax實現(xiàn)的實時刷新顯示數(shù)據(jù)功能示例
相關(guān)文章
AJAX開發(fā)技術(shù)在PHP開發(fā)中的簡單應(yīng)用技巧
AJAX無疑是2005年炒的最熱的Web開發(fā)技術(shù)之一,當(dāng)然,這個功勞離不開Google。我只是一個普通開發(fā)者,使用AJAX的地方不是特別多,我就簡單的把我使用的心得說一下。(本文假設(shè)用戶已經(jīng)具有JavaScript、HTML、CSS等基本的Web開發(fā)能力)2010-04-04
基于ajax html實現(xiàn)文件上傳技巧總結(jié)
這篇文章主要為大家詳細總結(jié)了基于ajax html實現(xiàn)文件上傳技巧,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-09-09
Ajax讀取數(shù)據(jù)之分頁顯示篇實現(xiàn)代碼
前幾篇的ajax教程里講了,讀取,添加,修改,刪除的功能.有幾天沒有更新了,雖然網(wǎng)上也有很多ajax分頁的教程和相關(guān)實例.2010-10-10

