利用AJAX實(shí)現(xiàn)鼠標(biāo)懸浮獲取值的代碼
更新時(shí)間：2009年12月04日 13:04:37 作者：
ajax實(shí)現(xiàn)將鼠標(biāo)放到圖標(biāo)上，下方會(huì)顯示和該圖有關(guān)的信息
客戶端代碼mouseover.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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠標(biāo)懸浮測(cè)試</title>
</head>
<script type="text/javascript" language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function sendRequest(t){
var id = t.id
createXMLHttpRequest();
var url = "mouseover_check.php?page=" +t.id ;
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>
<input type="text" value="here" id="1" onmouseover="sendRequest(this)" />
</p>
<p><br/>
<input type="text" value="haha" id="2" onmouseover="sendRequest(this)" />
</div>
</p>
<p></p>
<span id="show"></span>
</body>
</html>
服務(wù)器端代碼：
mouseover_check.php
<?php
header("Content-type:text/html;charset=gb2312");
header("cache-control:no-cache,must-revalidate");
$name = $_GET['page'];
if($name == '1'){
echo "111";
}
else{
echo "222";
}
?>
復(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)懸浮測(cè)試</title>
</head>
<script type="text/javascript" language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function sendRequest(t){
var id = t.id
createXMLHttpRequest();
var url = "mouseover_check.php?page=" +t.id ;
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>
<input type="text" value="here" id="1" onmouseover="sendRequest(this)" />
</p>
<p><br/>
<input type="text" value="haha" id="2" onmouseover="sendRequest(this)" />
</div>
</p>
<p></p>
<span id="show"></span>
</body>
</html>
服務(wù)器端代碼：
mouseover_check.php
復(fù)制代碼 代碼如下:
<?php
header("Content-type:text/html;charset=gb2312");
header("cache-control:no-cache,must-revalidate");
$name = $_GET['page'];
if($name == '1'){
echo "111";
}
else{
echo "222";
}
?>
相關(guān)文章
利用AjaxControlToolkit實(shí)現(xiàn)百度搜索時(shí)的下拉列表提示詳細(xì)步驟
AjaxControlToolkit是一組控件的集合，可以實(shí)現(xiàn)自動(dòng)補(bǔ)充文本框，點(diǎn)擊文本框彈出日歷，加水印等Ajax效果等等，感興趣的朋友可以了解下啊，或許本文對(duì)你學(xué)習(xí)ajax有所幫助2013-02-02
利用Ajax實(shí)現(xiàn)智能回答的機(jī)器人示例代碼
這篇文章主要介紹了利用Ajax實(shí)現(xiàn)智能回答的機(jī)器人,本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12
AJAX在Post中文的時(shí)候亂碼的解決方法...2007-03-03
Ajax讀取txt并對(duì)txt內(nèi)容進(jìn)行分頁(yè)顯示功能
這篇文章給大家介紹了Ajax讀取txt并對(duì)txt內(nèi)容進(jìn)行分頁(yè)顯示功能，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧2016-11-11
asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析
這篇文章主要介紹了asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)現(xiàn)方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了ajax分頁(yè)的具體實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-12-12
這篇文章主要為大家詳細(xì)介紹了非常實(shí)用的ajax用戶注冊(cè)模塊，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-07-07
這篇文章主要介紹了Ajax對(duì)緩存的處理方法,簡(jiǎn)單描述了緩存的功能,并結(jié)合實(shí)例形式分析了禁止瀏覽器對(duì)動(dòng)態(tài)程序文件緩存的實(shí)現(xiàn)方法,需要的朋友可以參考下2019-07-07
解決Ajax加載JSon數(shù)據(jù)中文亂碼問(wèn)題
這篇文章主要介紹了解決Ajax加載JSon數(shù)據(jù)中文亂碼問(wèn)題,需要的朋友可以參考下2017-10-10
AJAX請(qǐng)求隊(duì)列實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了AJAX請(qǐng)求隊(duì)列的實(shí)現(xiàn)代碼,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
AJAX分頁(yè)效果簡(jiǎn)單實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了AJAX分頁(yè)效果的簡(jiǎn)單實(shí)現(xiàn)代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06