Question

我有一个jQuery选项卡与ajax加载。

<script type='text/javascript'> 
$(document).ready(function() { 
    $("#nav li a").click(function() { 

     $("#ajax-content").empty().append("<div id='loading'><img src='{THEME}/images/loading.gif' alt='Loading' /></div>"); 
     $("#nav li a").removeClass('current'); 
     $(this).addClass('current'); 

     $.ajax({ url: this.href, success: function(html) { 
      $("#ajax-content").empty().append(html); 
      } 
    }); 
    return false; 
    }); 
}); 
</script> 

HTML代码：

<ul id="nav"> 
    <li><a href="test1.html">Page 1</a></li> 
    <li><a href="test2.html">Page 2</a></li> 
</ul> 
<div id="ajax-content">This is default text, which will be replaced</div> 

一切都很好，工作很好，但我需要别的东西。

我只需要在test1.html和test2.html中得到来自div的内容和答案ID。 我不想加载所有的页面。

在这些网页我有我的答案，一个div

，我test1.html页：

<div>Questions</div> 
Some Questions 

<div id="answers">Some answers</div> 

我只需要显示和ID =“答案”获取内容 我怎么能做到这一点？

如何在内容播放后添加淡入淡出效果？

Answer 1

与此更换您的通话$.ajax()：

var location = this.href +" #answers"; 
$("#ajax-content").load(location); 

查看加载页面片段的jQuery ajax .load()文档。

---

全码：

$(document).ready(function() { 
    $("#nav li a").click(function() { 

     $("#ajax-content").html("<div id='loading'><img src='{THEME}/images/loading.gif' alt='Loading' /></div>"); 

     $("#nav li a").removeClass('current'); 
     $(this).addClass('current'); 

     var location = this.href +" #answers"; 
     $("#ajax-content").load(location); 

     return false; 
    }); 
});