为什么我的Ajax函数返回我的整个代码？

我正在玩“头先Ajax”一书中的示例代码。下面是代码的突出件：为什么我的Ajax函数返回我的整个代码？

的index.php - HTML片：

<body> 
    <div id="wrapper"> 
    <div id="thumbnailPane"> 
     <img src="images/itemGuitar.jpg" width="301" height="105" alt="guitar" 
      title="itemGuitar" id="itemGuitar" onclick="getDetails(this)"/> 
     <img src="images/itemShades.jpg" alt="sunglasses" width="301" height="88" 
      title="itemShades" id="itemShades" onclick="getDetails(this)" /> 
     <img src="images/itemCowbell.jpg" alt="cowbell" width="301" height="126" 
      title="itemCowbell" id="itemCowbell" onclick="getDetails(this)" /> 
     <img src="images/itemHat.jpg" alt="hat" width="300" height="152" 
      title="itemHat" id="itemHat" onclick="getDetails(this)" /> 
    </div> 

    <div id="detailsPane"> 
     <img src="images/blank-detail.jpg" width="346" height="153" id="itemDetail" /> 
     <div id="description"></div> 
    </div> 

    </div> 
</body>

的index.php - 脚本：

function getDetails(img){ 
    var title = img.title; 
    request = createRequest(); 
    if (request == null) { 
    alert("Unable to create request"); 
    return; 
    } 
    var url= "getDetails.php?ImageID=" + escape(title); 
    request.open("GET", url, true); 
    request.onreadystatechange = displayDetails; 
    request.send(null); 
} 
function displayDetails() { 
    if (request.readyState == 4) { 
    if (request.status == 200) { 
     detailDiv = document.getElementById("description"); 
     detailDiv.innerHTML = request.responseText; 
    }else{ 
     return; 
    } 
    }else{ 
    return; 
    } 
    request.send(null); 
}

而且index.php文件：

<?php 
$details = array (
    'itemGuitar' => "<p>Pete Townshend once played this guitar while his own axe was in the shop having bits of drumkit removed from it.</p>", 
    'itemShades' => "<p>Yoko Ono's sunglasses. While perhaps not valued much by Beatles fans, this pair is rumored to have been licked by John Lennon.</p>", 
    'itemCowbell' => "<p>Remember the famous \"more cowbell\" skit from Saturday Night Live? Well, this is the actual cowbell.</p>", 
    'itemHat' => "<p>Michael Jackson's hat, as worn in the \"Billie Jean\" video. Not really rock memorabilia, but it smells better than Slash's tophat.</p>" 
); 
if (isset($_REQUEST['ImageID'])){echo $details[$_REQUEST['ImageID']];} 
?>

所有这些代码的作用是，当有人点击缩略图时，页面上会显示相应的文字说明。

这是我的问题。我试图将getDetails.php代码放入Index.php，并修改getDetails函数，以使var url为"Index.php?ImageID="... 。当我这样做时，我得到以下问题：该函数不会显示数组中的文本片段，因为它应该如此。相反，它会重现整个代码 - 网页等 - 然后在底部显示预期的文本片段。

这是为什么？ PS：好的，现在我明白了我的问题，这要归功于下面的两个回复。当我拨打url "Index.php?ImageID="...时，我不只是加载对应于$_GET的部分。我正在加载整个页面，现在使用非空值$_GET值。这就明确了为什么我需要为我想添加的内容创建一个单独的页面。

来源

2012-11-19 JDelage

那么，在你的全'index.php'你有没有指示它_not_返回内容的基础上某些条件的休息吗？你可以分享实际完整的'index.php'，而不是在其中移动snippits？ – David

当你认识到的图像信息的请求时，你吐出数据，但你没有什么办法阻止脚本的其余部分运行。你可以改变

if (isset($_REQUEST['ImageID'])){echo $details[$_REQUEST['ImageID']];}

喜欢的东西

if (isset($_REQUEST['ImageID'])){ 
    echo $details[$_REQUEST['ImageID']]; 
    exit; 
}

不过，我建议使用一个单独的URL的图像信息。毕竟，URL应该描述在那里找到的资源。

来源

2012-11-19 22:59:05 grossvogel

嗯，那是因为你请求的整个页面，Ajax的成功，并返回页面给你，因为你已经要求。

Ajax不适用于相同页面的请求。将处理文件与索引文件分开。

来源

2012-11-19 22:57:44

为什么我的Ajax函数返回我的整个代码？

回答

相关问题