0

我是 ajax 新手,但目前有一些代码会在单击链接后更改网站的内容区域。
问题是,我想使用不同的按钮加载不同的内容,但当前代码只允许我链接到一个文件/页面。

  <script>
    function loadXMLDoc()
{
    var xmlhttp;
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("centreCont").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","../home/indexFav.php",true);
    xmlhttp.send();
    }
    </script>

您可以在上面的脚本中看到,当我链接到脚本时,ajax 将始终指向“../home/indexFav.php”。

我想使用不同的链接来加载不同的内容。如何才能做到这一点?

这是我的html:

<div class="" onclick="loadXMLDoc()">Everyone</div>
<div class="" onclick="loadXMLDoc()">Favourites Only</div>
4

2 回答 2

0

向您的函数添加一个附加参数,loadXMLDOC该参数需要加载 URL。例如:

function loadXMLDoc(url) {
  ...
  xmlhttp.open("GET",url",true);
  xmlhttp.send();
}

然后改变你的onclick方法:

<div class="" onclick="loadXMLDoc('../home/indexFav.php')">Everyone</div>
<div class="" onclick="loadXMLDoc('../home/indexAll.php')">Favourites Only</div>
于 2013-08-18T12:45:30.727 回答
0

这就是您可以向 AJAX 函数添加“参数”的方式,然后您可以使用不同的值调用该函数。下面的Javascript:

<script>
function loadXMLDoc(pageName)
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("centreCont").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","../home/" + pageName + ".php",true);
xmlhttp.send();
}
</script>

那么你的 html 可能/会是这样的:

    <div class="" onclick="loadXMLDoc('indexEveryone')">Everyone</div>
    <div class="" onclick="loadXMLDoc('indexFav')">Favourites Only</div>

希望有帮助。

于 2013-08-18T12:45:58.593 回答