jQuery追加为文本而不是html

Question

以下代码从Ajax json调用获取值,并应将其附加到具有相应值的div.事实是,它作为文本而不是html附加,所以我在页面上看到我的html作为文本.我怎样才能解决这个问题？

$.ajax({
    url: "https://domain.com/maprequest.php",
    type: "POST",
    dataType: 'json',
    data: JSON.stringify(url_array),
    crossDomain: true,
    success: function(response) {
        $.each(response, function(k, v) {
            if (v != "") {
                $('.offer-list li .img a')[k].append("<div class='hoverbox'><img src='" + v + "' alt='hover' /></div>");
            }
        });
    }
});

Answer 1

通过编写,$('.offer-list li .img a')[k]您可以获得索引处的实际HTML元素k,而不是jQuery集合.我想你的问题是由此引起的.

试试这个代码.

$('.offer-list li .img a').eq(k).append("<div class='hoverbox'><img src='" + v + "' alt='hover' /></div>");

该eq函数将在内部过滤索引处HTML元素的jQuery集k.请参阅此处的文档.

让您感到困惑的是HTML元素具有append和appendChild方法,并且每个元素分别将纯文本或子节点附加到给定元素,因此您的代码将HTML作为纯文本附加.