Question

我有一些数据需要在页面上呈现。该页面的形式将如下所示：

<div class="container">
    <div class="row align-items-center">
        <div class="col-md-3">
            <div style="border: 2px solid grey; border-radius: 12px; padding: 5px; margin-bottom: 10px" class="anliegenGrammatik"></div>
        </div>
        <div class="col-md-3">
            <button class="btn"><b style="color: red">X</span></b>
        </div>
    </div>
</div>

这是从那里获取数据的：

function selectGrammar(grammar) {
    var params = {};
    params['BereichID'] = bereichsID;
    params['GrammarName'] = grammar.text.trim();
    params = JSON.stringify(params, null, ' ');
    $.ajax({
        url: 'http://localhost/something&DLLFunc=getAnliegenGrammar',
        type: "POST", // type of action POST || GET
        data: params,
        dataType: 'json', // data type
        contentType: "application/json; charset=utf-8",
        success: function(response) {
            $('#exampleModalLong').modal('toggle');
            $('.anliegenGrammatik').text("Test");
            showPage('afterBrowse');
        },
        error: function(xhr, resp, text) {
            console.log(xhr, resp, text);
        }
    })
}

作为response，我有多个项目（如JSON）...而且我想为每个项目渲染一个div。

我尝试过这样的事情：

$.each(response, function(index) {
    $('.anliegenGrammatik').text(response[index].name);
});

但是它仅填充并显示一个格。

有人吗？

Answer 1

之所以会这样，是因为您不断更改同一元素select { color: black; } select:empty { color: gray; } //invalid的文本

您的html和循环应该像

.anliegenGrammatik

Answer 2

jQuery text方法将覆盖元素的内容。尝试使用append代替text。

赞：

$.each(response, function(index) {
    $('.anliegenGrammatik').append(response[index].name + ', ');
});

使用jQuery结果渲染多个div

2 个答案: