jQuery循环每个构建Html列表

jQuery Looping Each to Build Html List

本文关键字:Html 列表 构建 循环 jQuery      更新时间:2023-09-26

我需要解析ajax错误。

这是我的代码。

error:function(data){
        var errors = data.responseJSON;
        errorsHtml = '<div class="alert alert-danger"><ul>';
        $.each( errors, function(key, value) {
            errorsHtml += '<li>'+ errors[key] + '</li>'; //showing only the first error.
        });
        errorsHtml += '</ul></div>';
        alert(errorsHtml);
},

输出为

<div class="alert alert-danger"><ul><li>The Address Name field is required.,The Recipient field is required.,The Address field is required.</li></ul></div>

我不能这样做

<div class="alert alert-danger>
<ul>
    <li>The Address Name field is required.</li>
    <li>The Recipient field is required.</li>
    <li>The Address field is required.</li>
</ul>

我哪里出错了

在您的内容中,errors是一个对象,它有一个名为errors的键,它有一个错误消息数组。

那么你需要做的就是遍历errors数组所以

var errors = data.responseJSON;
errorsHtml = '<div class="alert alert-danger"><ul>';
$.each(errors.errors, function (key, value) {
    errorsHtml += '<li>' + value + '</li>'; //showing only the first error.
});
errorsHtml += '</ul></div>';
alert(errorsHtml);

另一个简单的方法是

var errorsHtml = '<div class="alert alert-danger"><ul>';
errorsHtml += '<li>' + errors.errors.join('</li><li>') + '</li>';
errorsHtml += '</ul></div>';