上單擊顯示的Iframe

我有一張地圖，你可以上的位置點擊獲取信息，這方面的，我想顯示在同一頁面中的iframe的信息點擊上單擊顯示的Iframe

時

我的頁面有這樣的鏈接現在

`<AREA SHAPE="CIRCLE" COORDS="555,142,6" HREF="http://www.Page.com" TITLE="" />`

任何建議

來源

2012-04-01 Justin Petty

AJAX的好處是，你並不真的需要一個IFRAME做到這一點。

你有一個服務器，將返回給你有關某一領域的信息。每個AREA標籤都只需要一個onclick屬性，該屬性調用JavaScript函數來檢索該信息並將其顯示在您在頁面上放置的位置。

下面是一個簡單的HTML頁面將使用AJAX

<html> 
<head> 
<script type="text/javascript"> 
function getAreaInfo(id) 
{ 
    var infoBox = document.getElementById("infoBox"); 
    if (infoBox == null) return true; 
    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function() { 
    if (xhr.readyState != 4) return; 
    if (xhr.status != 200) alert(xhr.status); 
    infoBox.innerHTML = xhr.responseText; 
    }; 
    xhr.open("GET", "info.php?id=" + id, true); 
    xhr.send(null); 
    return false; 
} 
</script> 
<style type="text/css"> 
#infoBox { 
    border:1px solid #777; 
    height: 400px; 
    width: 400px; 
} 
</style> 
</head> 
<body onload=""> 
<p>AJAX Test</p> 
<p>Click a link... 
<a href="info.php?id=1" onclick="return getAreaInfo(1);">Area One</a> 
<a href="info.php?id=2" onclick="return getAreaInfo(2);">Area Two</a> 
<a href="info.php?id=3" onclick="return getAreaInfo(3);">Area Three</a> 
</p> 
<p>Here is where the information will go.</p> 
<div id="infoBox">&nbsp;</div> 
</body> 
</html>

從服務器獲取信息，而這裏是回信息返回到HTML頁面info.php的：

<?php 
$id = $_GET["id"]; 
echo "You asked for information about area #{$id}. A real application would look something up in a database and format that information using XML or JSON."; 
?>

希望這可以幫助！

來源

2012-04-04 13:39:13 dldnh

上單擊顯示的Iframe

回答

相關問題