时间戳

首页 > 解决方案 > Ajax 返回文本，而不是 html

jquery - Ajax 返回文本，而不是 html

问题描述

我有一个完整的代码，用于通过带有 JSON 数据类型的 Jquery AJAX 从 PHP 获取值。但是ajax完成后，它不响应html。它成为文本。

结果变成了这样。

$("#category li").one('click', function() {

    var catId = $(this).attr("id");

    var that = this;

    $.ajax({
            type: 'GET',
            url: '<?php echo base_url()."dashboard/getsubcategory/"; ?>'+catId,
            dataType: 'html',
            data: { category: catId},
            beforeSend: function() {
                $("#loader").show();
            }
        })

    .done(function(data){
        var categories = JSON.parse(data)

        $.each(categories, function(k,category) {

            that.after('<li class="collection-item">'+category.id+'</li>');

        });

    })
    .fail(function() {

        alert( "Fetch failed." );

    });

});

JSON输出：

[
  {
    "id": "7",
    "name": "Blazer & Suits"
  },
  {
    "id": "8",
    "name": "Blouses & Shirts"
  },
  {
    "id": "9",
    "name": "Friendly URL in CodeIgniter"
  }
]

为什么它返回：

&lt;li class="collection-item"&gt;7&lt;/li&gt;
&lt;li class="collection-item"&gt;8&lt;/li&gt;
&lt;li class="collection-item"&gt;9&lt;/li&gt;

我期望的输出是

<li class="collection-item">7</li>
<li class="collection-item">8</li>
<li class="collection-item">9</li>

预习 ：

http://prntscr.com/n1x0ey

请帮忙 ..

非常感谢。

标签： jqueryajax

解决方案

您将引用元素的变量存储在变量中，并使用它附加到文档中。您应该在之后调用方法之前包装元素。

此外，在您的 ajax 调用中，当您似乎期望一个json时，您将值dataType设置为html。

因此，总结起来，您的代码应如下所示：

$("#category li").one('click', function() {
    var $that = $(this);
    var catId = $that.attr("id");

    $.ajax({
        type: 'GET',
        url: '<?php echo base_url()."dashboard/getsubcategory/"; ?>'+catId,
        dataType: 'json',
        data: { category: catId},
        beforeSend: function() {
            $("#loader").show();
        }
    })
    .done(function(data) {
        data.forEach(function(category) {
            $that.after('<li class="collection-item">'+category.id+'</li>');
        });
    })
    .fail(function() {
        alert( "Fetch failed." );
    });
});

推荐阅读