javascript - Bootbox 模式无法正确格式化 HTML

Question

我正在使用 bootbox 作为我网站的弹出模式。当调用下面的函数时，我想显示一个包含一些信息的小表格。

function infoModal(){
    var table = "<div>" + "<table class='formattedTable'>" + "<thead>" + "<tr>Legend</tr>" + "</thead>" + "<tbody>" + "<tr class='catString'>This color is the first color.</tr>" + "<tr class='warn'>This color is the second color.</tr>" + "<tr class='caution'>This color is the third color.</tr>" + "<tr class='danger'>This color is the fourth color.</tr>" + "</tbody>" + "</table>" +"</div>";
    bootbox.confirm({
        message: table,
        buttons: {
                confirm: {
                    label: 'OK'
                }
        },
        callback: function (result) {
            if (result) {
                console.log("Thanks for using this modal!");
            }
        }
    });

}

但是，当我在 HTML 中测试它时，它的格式如下:

<div class="bootbox-body">
 <div>LegendThis color is the first color.This color is the second color.This color is the third color.This color is the fourth color.

    <table class="formattedTable">
        <thead><tr></tr></thead>
        <tbody>
            <tr class="catString"></tr>
            <tr class="warn"></tr>
            <tr class="caution"></tr>
            <tr class="danger"></tr>
        </tbody>
    </table>
    </div>
    </div>

我知道我没有像上面的 table 变量中那样放置 div(减去 bootbox-body div)，那么这里发生了什么？

Answer 1

刚刚弄清楚 - 我忘记了 <td>进入每一行的标签!该函数应如下所示:

function infoModal(){
    var table = "<div>" + "<table class='formattedTable'>" + "<thead>" + "<tr><td>Legend</td></tr>" + "</thead>" + "<tbody>" + "<tr class='catString'><td>This color is the first color.</td></tr>" + "<tr class='warn'><td>This color is the second color.</td></tr>" + "<tr class='caution'><td>This color is the third color.</td></tr>" + "<tr class='danger'><td>This color is the fourth color./<td></tr>" + "</tbody>" + "</table>" +"</div>";
    bootbox.confirm({
        message: table,
        buttons: {
                confirm: {
                    label: 'OK'
                }
        },
        callback: function (result) {
            if (result) {
                console.log("Thanks for using this modal!");
            }
        }
    });

}