Question

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

<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 =“answers”获取内容我怎么能这样做？

如何在内容丢失后添加淡化效果？

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;
    });
});

使用ajax和tab从div id获取内容

1 个答案: