JQuery ajax()實例

前端頁面:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>搜索</title>
</head>

<body>
<div class="zgz">請輸入(A-Z):<input type="text" value="GET"></div>
<div class="rep">姓名:</div><br><br>
<div class="zgzB">請輸入(A-Z):<input type="text" value="POST"></div>
<div class="repB">姓名:</div>
<script src="js/jquery.min.js"></script>
<script>

$(function(){

var oBtn=$('.zgz input');
var oDiv=$('.rep');

var oBtnB=$('.zgzB input');
var oDivB=$('.repB');

oBtn.click(function(){$(this).val('')})

oBtn.keyup(function(){

$.ajax({

type:"get",//ajax請求方式(只有兩種:get/post)

data:{q:oBtn.val()},//傳給服務器的數據(json格式).

url:"php1.php",//ajax請求地址(將data的數據發送給(php1.php),后臺獲得數據進行處理,處理完再返還給前臺)

success: function(dat){//對響應回來(后臺返還回來)的數據進行處理

oDiv.html("姓名:");
oDiv.append(dat);

}
});
});

});

</script>
</body>
</html>

后臺(php):

<?php
// 用名字來填充數組
$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";

//獲得來自 URL 的 q 參數
$q=$_GET["q"];

//如果 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];
}
}
}
}

// 如果未找到提示,則把輸出設置為 "no suggestion"
// 否則設置為正確的值
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}

//輸出響應
echo $response;
?>

?

轉載于:https://www.cnblogs.com/Greenzgz/p/4498116.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/257314.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/257314.shtml
英文地址,請注明出處:http://en.pswp.cn/news/257314.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

黑馬數據庫html階段考試,黑馬web階段web試題學生版.docx

Web 階段 Web 試題1. 動態網站的開發技術有 (A)JSPHTMLCSSJavaScript 下面哪個請求頭信息可以實現防盜鏈 (C)LocationRefreshRefererIf-Modified-Since在Web應用程序的文件與目錄結構中&#xff0c;是放置在(A )WEB-INF 目錄conf 目錄lib 目錄classes 目錄下面哪一個指明向客戶…

學生信息管理系統中遇到的問題解析

項目概述&#xff1a;做一個簡單的學生信息管理系統 要求&#xff1a;學生信息的增刪查改&#xff0c;成績的增刪。自動生成的編號。 工具&#xff1a;微軟企業庫與MiniUI 遇到的問題與解決方法&#xff1a;&#xff08;前面的博文也有類似的問題和解決方法&#xff0c;這里不再…

簡單地使用線程之一:使用異步編程模型

.NetFramework的異步編程模型從本質上來說是使用線程池來完成異步的任務&#xff0c;異步委托、HttpWebRequest等都使用了異步模型。 這里我們使用異步委托來說明異步編程模型。 首先&#xff0c;我們來明確一下&#xff0c;對于多線程來說&#xff0c;我們需要關注哪些問題。 …

ShowType=0,交換機命令showinterfacestype0/port_#switchport|trunk用于顯 - 信管網

交換機命令show interfaces type0/port_# switchport|trunk用于顯示中繼連接的配置情況&#xff0c;下面是顯示例子&#xff1a;2950#show interface fastEthernet0/1 switchportName: fa0/1Switchport: EnabledAdministrative mode: trunkOperational Mode: trunkAdministrati…

SQL SERVER學習筆記(二)數據庫管理

第二部分&#xff1a;數據庫管理 單詞記憶&#xff1a;transact&#xff1a;處理 create&#xff1a;創建 execute&#xff1a;執行、完成 一、 SQL Server的特性 1、 安裝簡便&#xff1a;為了便于安裝、使用和管理&#xff0c;SQL Server2000提供了一組管理和開發工具。 …

SQL——快速定位相關的外鍵表

轉載于:https://www.cnblogs.com/mingle/p/4506422.html

Linux安裝glibc(升級版本)

2019獨角獸企業重金招聘Python工程師標準>>> glibc下載地址&#xff1a;http://ftp.gnu.org/gnu/glibc/ 這里下載 glibc-2.15&#xff1a; http://ftp.gnu.org/gnu/glibc/glibc-2.15.tar.gz glibc-ports-2.15&#xff1a; http://ftp.gnu.org/gnu/glibc/glibc-ports…

定義列表的特點html,HTML的列表表格表單知識點

無序列表格式 有序列表格式第一項 …

Javascript 獲取url參數,hash值 ,cookie

/*** 獲取請求參數* param key* returns {*}*/ function getRequestParameter(key){var params getRequestParameters();return params[key]; }/*** 獲取請求參數列表* returns {{}}*/ function getRequestParameters(){var arr (location.search || "").replace(/…

C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和邊框寬度的二維碼

本文介紹在 C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和邊框寬度的二維碼。網上文章大多只是簡單介紹內置參數的設置&#xff0c;根據我的使用目的&#xff0c;增加了自定義目標二維碼圖片尺寸和白邊邊框。有需要的朋友們可以試一下&#xff0c;如有bug歡迎指正。 首先&…

html設置百度協議,網站HTML結構SEO要求說明(含移動站)

網頁結構一、網頁中主體結構標簽一一對應。網頁頭部區域網頁底部區域網頁邊框區域網頁導航區域網頁章節、頁眉、頁腳詳情頁文章區域詳情頁作者信息詳情頁中文章的發布日期列表頁中文章列表區域二、其他說明1、首頁head中標注Meta標簽協議&#xff0c;標識對應的網頁瀏覽&#x…

【Fanvas技術解密】HTML5 canvas實現臟區重繪

先說明一下&#xff0c;fanvas是筆者在企鵝公司開發的&#xff0c;即將開源的flash轉canvas工具。 臟區重繪(dirty rectangle)并不是一門新鮮的技術了&#xff0c;這在最早2D游戲誕生的時候就已經存在。 復雜的術語或概念就不多說&#xff0c;簡單說&#xff0c;臟區重繪就是每…

javascript 學習教程

1&#xff0c;JavaScript 是一種輕量級的編程語言&#xff0c;是可插入 HTML 頁面的編程代碼。 2,以<script>標簽開始&#xff0c;以</script>標簽結束。 3,引用放在外部文件的擴展名為.js的腳本文件 <script src"myScript.js"></script> 4&…

我國非按勞分配收入

我國現階段非按勞分配收入探討 我國社會主義初級階段的個人消費品分配&#xff0c;是通過多種分配方式實現的。除了占主體地位的按勞分配方式之外&#xff0c;還存在許多種類的非按勞分配方式。因此&#xff0c;在我國城鄉居民個人收入總額中&#xff0c;除了一部分按勞分配收入…

html調用js里面的函數,html如何調用js函數

html調用js函數的方法&#xff1a;1、用控件本身進行調用&#xff1b;2、通過javascript中的時間控件定時執行&#xff1b;3、通過getElementById調用&#xff1b;4、通過document.getElementsByName調用。本文操作環境&#xff1a;Windows7系統、html5&&javascript1.8…

大部分人都會做錯的經典JS閉包面試題

2019獨角獸企業重金招聘Python工程師標準>>> 由工作中演變而來的面試題 JS中有幾種函數 創建函數的幾種方式 三個fun函數的關系是什么&#xff1f; 函數作用域鏈的問題 到底在調用哪個函數&#xff1f; 后話 轉載于:https://my.oschina.net/u/3687565/blog/1549046

STM32片上Flash內存映射、頁面大小、寄存器映射

轉自&#xff1a;http://blog.chinaunix.net/uid-20617446-id-3847242.html 一、怎么看Flash大小 1.1 通過型號 型號會印在MCU表面&#xff0c;可以通過觀察獲得&#xff0c;我的是STM32F103RBT6(以下分析基于這個型號)&#xff0c;對照下圖的STM32產品命名&#xff0c;可知STM…

如何設計實現一個地址反解析服務?

http://www.cnblogs.com/LBSer/p/4507829.html 一、什么是地址反解析 我們都知道手機定位服務&#xff0c;其本質是匯總各種信號得出一個經緯度坐標&#xff08;x,y&#xff09;&#xff08;具體定位原理可以參考&#xff1a;LBS定位技術、基于樸素貝葉斯的定位算法&#xff09…

html5 hr代碼縮減比例,HTML HR size用法及代碼示例

DOM HR size屬性用于設置或返回元素的size屬性的vlue。用法:它返回HR大小屬性。hrobject.size用于設置HR大小屬性。hrobject.size"value"屬性值&#xff1a;value:它包含指定HR元素高度的像素值。返回值&#xff1a;它返回一個字符串值&#xff0c;該值代表HR元素的高…

【轉】C++標準轉換運算符static_cast

static_cast<new_type> (expression) 雖然const_cast是用來去除變量的const限定&#xff0c;但是static_cast卻不是用來去除變量的static引用。其實這是很容易理解的&#xff0c;static決定的是一個變量的作用域和生命周期&#xff0c;比如&#xff1a;在一個文件中將變量…