-1

我想实现这样的目标。当我向下滚动时,页面会自动加载新内容。我想通过单击页面底部的超链接来获取新的数据集。

作为 AJAX 的新手,我正在检查这个与我的问题相似的问题,但它不起作用。当我运行代码时,我得到的只是一个空对象。这是我文件中的代码:

索引.php

<a href="about.php">About Me</a> <br>
<a href="contact.php">Contact Me</a>
<div class="wrap"></div>

<script>
    (function(){
        var wrap = $('div.wrap');
        $('a').on('click', function(e){
            var href = $(this).attr('href');
            $.get(href, function(data){
                console.log($(data).find('div.container'));
                $(data).find("div.container").appendTo(wrap);
            });
            e.preventDefault();
        });
    })();
</script>

关于.php

</div>
<div class="container">
    <h2>About Me</h2>
    <p>I suck at AJAX ! :-(</p>
</div>

联系人.php

<div class="container"><h1>Contact!</h1>
  <form action="#">
  <textarea name="content" id="content" cols="30" rows="10"></textarea>
  <input type="url" name="url" id="url">
  <p><button type="submit">Save</button></p>
  </form>
</div>

截屏:

空对象截图

我错过了什么吗?是否.get()click()事件的回调函数中工作?但是当我这样做时它工作得很好.load()......对不起这个大帖子,但我在这里完全不知所措!:/请帮帮我?

4

2 回答 2

1
(function(){
    var wrap = $('div.wrap');
    $('a').on('click', function(e){
        var href = $(this).attr('href');
        $.get(href, function(data){
            console.log($(data).filter('div.container'));
            wrap.append($(data).filter(".container"));
        });
        e.preventDefault();
    });
})();
于 2012-09-02T14:01:24.117 回答
1

至于为什么$.get()不起作用,您需要准备好返回的数据以供 DOM 遍历技术使用:

(function(){
    var wrap = $('div.wrap');
    $('a').on('click', function(e){
        e.preventDefault();
        var href = $(this).attr('href');
        $.get(href, function(data){
            var $content = $('<div />').html(data);
            console.log( $content.find('div.container') );
            $content.find("div.container").appendTo(wrap);
        });
    });
})();

jsFiddle Demo注意 jsFiddle 的测试资源是需要$.post而不是$.get,但原理是一样的。


类似的事情,使用.load()jsFiddle demo)完成:

(function(){
    var wrap = $('div.wrap');
    $('a').on('click', function(e){
        e.preventDefault();
        var href = $(this).attr('href');
        $('<div />')
            .load(href +' div.container')
            .appendTo(wrap)
            .children(':first-child')
            .unwrap();
    });
})();​
于 2012-09-02T14:01:35.317 回答