欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

PHP 和 AJAX 請求

AJAX 請求

在下面的 AJAX 例子中,我們將演示當(dāng)用戶向 web 表單中輸入數(shù)據(jù)時,網(wǎng)頁如何與在線的 web 服務(wù)器進(jìn)行通信。

在下面的文本框中輸入名字:

Suggestions:

這個例子包括三張頁面:

  • 一個簡單的 HTML 表單
  • 一段 JavaScript
  • 一張 PHP 頁面

HTML 表單

這是 HTML 表單。它包含一個簡單的 HTML 表單和指向 JavaScript 的鏈接:

<html>
<head>
<script src="clienthint.js"></script> 
</head>

<body>

<form> 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form>

<p>Suggestions: <span id="txtHint"></span></p>

</body>
</html>

例子解釋 - HTML 表單

正如您看到的,上面的 HTML 頁面含有一個簡單的 HTML 表單,其中帶有一個名為 "txt1" 的輸入字段。

該表單是這樣工作的:

  1. 當(dāng)用戶在輸入域中按下并松開按鍵時,會觸發(fā)一個事件
  2. 當(dāng)該事件被觸發(fā)時,執(zhí)行名為 showHint() 的函數(shù)
  3. 表單的下面是一個名為 "txtHint" 的 <span>。它用作 showHint() 函數(shù)所返回數(shù)據(jù)的占位符。

JavaScript

JavaScript 代碼存儲在 "clienthint.js" 文件中,它被鏈接到 HTML 文檔:

var xmlHttp

function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML=""
  return
  }
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
  {
  alert ("Browser does not support HTTP Request")
  return
  } 
var url="gethint.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
} 

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 // Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}

例子解釋:

showHint() 函數(shù)

每當(dāng)在輸入域中輸入一個字符,該函數(shù)就會被執(zhí)行一次。

如果文本框中有內(nèi)容 (str.length > 0),該函數(shù)這樣執(zhí)行:

  1. 定義要發(fā)送到服務(wù)器的 URL(文件名)
  2. 把帶有輸入域內(nèi)容的參數(shù) (q) 添加到這個 URL
  3. 添加一個隨機數(shù),以防服務(wù)器使用緩存文件
  4. 調(diào)用 GetXmlHttpObject 函數(shù)來創(chuàng)建 XMLHTTP 對象,并在事件被觸發(fā)時告知該對象執(zhí)行名為 stateChanged 的函數(shù)
  5. 用給定的 URL 來打開打開這個 XMLHTTP 對象
  6. 向服務(wù)器發(fā)送 HTTP 請求

如果輸入域為空,則函數(shù)簡單地清空 txtHint 占位符的內(nèi)容。

stateChanged() 函數(shù)

每當(dāng) XMLHTTP 對象的狀態(tài)發(fā)生改變,則執(zhí)行該函數(shù)。

在狀態(tài)變成 4 (或 "complete")時,用響應(yīng)文本填充 txtHint 占位符 txtHint 的內(nèi)容。

GetXmlHttpObject() 函數(shù)

AJAX 應(yīng)用程序只能運行在完整支持 XML 的 web 瀏覽器中。

上面的代碼調(diào)用了名為 GetXmlHttpObject() 的函數(shù)。

該函數(shù)的作用是解決為不同瀏覽器創(chuàng)建不同 XMLHTTP 對象的問題。

這一點在上一節(jié)中已經(jīng)解釋過了。

PHP 頁面

被 JavaScript 代碼調(diào)用的服務(wù)器頁面是一個名為 "gethint.php" 的簡單服務(wù)器頁面。

"gethint.php" 中的代碼會檢查名字?jǐn)?shù)組,然后向客戶端返回對應(yīng)的名字:

<?php
// Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";

//get the q parameter from URL
$q=$_GET["q"];

//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
  {
  if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
    {
    if ($hint=="")
      {
      $hint=$a[$i];
      }
    else
      {
      $hint=$hint." , ".$a[$i];
      }
    }
  }
}

//Set output to "no suggestion" if no hint were found
//or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}

//output the response
echo $response;
?>

如果存在從 JavaScript 送來的文本 (strlen($q) > 0),則:

  1. 找到與 JavaScript 所傳送的字符相匹配的名字
  2. 如果找到多個名字,把所有名字包含在 response 字符串中
  3. 如果沒有找到匹配的名字,把 response 設(shè)置為 "no suggestion"
  4. 如果找到一個或多個名字,把 response 設(shè)置為這些名字
  5. 把 response 發(fā)送到 "txtHint" 占位符