Question

我无法从我的ajax请求中获取data以显示在<div class="l_p_i_c_w"></div>中。我究竟做错了什么？我知道my_file.php中的函数有效，因为如果我刷新页面，那么数据会显示在应该的位置。

jQuery的：

$.ajax({
        type: "POST",
        url: "my_file.php",
        dataType: 'html',
        success: function(data){
            $('div#myID div.l_p_c div.l_p_i_c_w').prepend(data);
        }
});

HTML：

<div class="l_p_w" id="myID">
    <div class="l_p_c">
        <div class="l_p_i_c_w">
       <!-- stuff, or may be empty. This is where I want my ajax data placed. -->
        </div>
    </div>
</div>

CSS：

.l_p_w {
    width:740px;
    min-height:250px;
    margin:0 auto;
    position:relative;
    margin-bottom:10px;
}

.l_p_c {
    position:absolute;
    bottom:10px;
    right:10px;
    width:370px;
    top:60px;
}

.l_p_i_c_w {
    position:absolute;
    left:5px;
    top:5px;
    bottom:5px;
    right:5px;
    overflow-x:hidden;
    overflow-y:auto;
}

Answer 1

我认为如果你使用prepend，你需要在附加之前将数据对象包装在jquery标签中，如$（data），因为prepend追加子（对象）

$.ajax({
            type: "POST",
            url: "my_file.php",
            dataType: 'html',
            success: function(data){
                $('div#myID div.l_p_c div.l_p_i_c_w').prepend($(data));
            }
    });

但是，如果你只是想用数据设置div的html，请执行以下操作：

$.ajax({
        type: "POST",
        url: "my_file.php",
        dataType: 'html',
        success: function(data){
            $('div#myID div.l_p_c div.l_p_i_c_w').html(data);
        }
});

第三个选项，尝试prependTo

http://api.jquery.com/prependTo/

$.ajax({
    type: "POST",
    url: "my_file.php",
    dataType: 'html',
    success: function(data){
        $(data).prependTo($('div#myID div.l_p_c div.l_p_i_c_w'));
    }
});

最后一次尝试：

$.ajax({
            type: "POST",
            url: "my_file.php",
            dataType: 'html',
            success: function(data){
                $('div#myID div.l_p_c div.l_p_i_c_w').html(data + $('div#myID div.l_p_c div.l_p_i_c_w').html());
            }
    });

Answer 2

 $('div#myID div.l_p_c div.l_p_i_c_w').prepend(data);

应该是

 $('#myID .l_p_c .l_p_i_c_w').html(data);

Answer 3

试试这个：

$.ajax({
        type: "POST",
        url: "my_file.php",
        dataType: 'html',
        complete: function(jqXHR, settings){
            if (jqXHR.status == 200)
               $('div#myID div.l_p_c div.l_p_i_c_w').prepend(jqXHR.responseText);
        }
});

或

$.ajax({
        type: "POST",
        url: "my_file.php",
        dataType: 'html'
}).done(function(data) {
     $('div#myID div.l_p_c div.l_p_i_c_w').prepend(data);
});

Answer 4

prependTo()怎么办？

$.ajax({
            type: "POST",
            url: "my_file.php",
            dataType: 'html',
            success: function(data){
                $(data).prependTo('#myID .l_p_c .l_p_i_c_w');
            }
    });

正如@rajesh在对你的问题的评论中提到的那样，尝试提醒成功的数据，以确保它按预期回来：

$.ajax({
            type: "POST",
            url: "my_file.php",
            dataType: 'html',
            success: function(data){
                alert(data);
            }
    });

如何从ajax请求中获取数据以显示在div中？

4 个答案: