Ajax 返回文本，而不是 html答案

【问题标题】：Ajax Returning to text, not htmlAjax 返回文本，而不是 html
【发布时间】：2019-03-24 01:44:06
【问题描述】：

我有一个完整的代码，用于通过带有 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

请帮忙..

非常感谢。

【问题讨论】：

请张贴代码。否则谁也帮不了。

标签： jquery ajax

【解决方案1】：

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

此外，在您的 ajax 调用中，您正在将值 dataType 设置为 html，而您似乎需要一个 json。

所以，总结一下，您的代码应该如下所示：

$("#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." );
    });
});

【讨论】：