如何使用ajax定位特定的id?

时间:2014-02-22 20:11:56

标签: javascript php jquery css ajax

我第一次尝试ajax(并且在很大程度上是js)所以我不确定我做错了什么。

目标是边栏中的一系列缩略图会在选中时更改位于中心的div的内容。链接目前看起来像这样:

<img src="images/thumbs/elon-scissors-logo.jpg" onclick="reloadMiddleWith('about','about','test')"/>

单击时会运行以下功能并更改背景并调用php源。

function reloadMiddleWith(theme, page, content) {
  var new_url = "http://www.chrisjohndesigns.com/" + page + ".php/#" + content;
  $('#live-area').addClass(theme);
  $.ajax({
      url: new_url,
      dataType: 'html'
 })
  .done(function(data) {
      // Assuming the request returns HTML, replace content
      $('#area-loader').html(data);
 });

}

我测试了它并且当它只是背景和新的php页面时它工作得很好,而不是让50个页面调用(并且由于缺乏正确的理解而目前甚至没有尝试数组或数据库)我想我只想制作一个或两个重复相同容器样式的新页面,然后通过id标签调用我想要显示的页面。目前,当我尝试它时,它只是改变背景但不改变php内容。

1 个答案:

答案 0 :(得分:0)

jQuery本身有一个方便的函数jQuery(...).load,使用它jQuery将处理所有必要的点:

function reloadMiddleWith(theme, page, content) {
    var new_url = "http://www.chrisjohndesigns.com/" + page + ".php/#" + content;
    $('#live-area').addClass(theme);
    jQuery("#area-loader").load(new_url);
}

有关详细信息,请查看documentation page