Question

大家好，我可能需要你帮忙解决一些我无法理解的问题。

我有一个注册表单，最近我为填充输入中的错误添加了一个红色表，但现在我遇到了一个新问题，所有错误都在一行中，我不知道怎么办“输入“把它拿下来所以它会在列表中，而不是从右到左一个接一个。”

document.getElementById("ErrorTable").innerHTML += '•Agree with the terms';

这是表HTML：

    <center>
         <div class="RegisterTextArea">
            <table id="ErrorTable">

            </table>
         </div>
    </center>

我有一个新问题：http://prntscr.com/7bxe6k。如何清除UL，使其不再像图片一样再次提交，以及如何将其放入盒子中，以便在没有空间时将其左侧分开。

HTML：

<center>
     <div class="errors">
        <ul id="ErrorTable"></ul>
     </div>
</center>

式：

.errors
{
background-color: #FFB6B6;
border: groove 1px #A81B1B;
width: 500px; 
height: 50px;
text-align: right;
font-size: 10px;
color: #A81B1B;
}

.errors ul li
{

}

Answer 1

我认为您可以使用无序Html列表而不是表格。我已将您的代码更新如下

HTML

<center>
     <div class="RegisterTextArea">
        <ul id="ErrorTable">
        </ul>
     </div>
</center>

Java脚本

    document.getElementById("ErrorTable").innerHTML = '';
    document.getElementById("ErrorTable").innerHTML += '<li>Agree with the terms</li>';

希望你得到这样的结果。

Answer 2

如果您需要列表，则需要使用列表而不是表格。

<ul id="errors">

</ul>

您不能将文字直接放在列表中（或表格中）;你必须用适当的标记包装它。对于列表，这是一个列表项。

function add_error( error_message ) {
    var list_item = document.createElement('li');
    var text = document.createTextNode(error_message);
    list_item.appendChild(text);
    document.getElementByid('errors').appendChild(list_item);
}

add_error("Agree with the terms");

无序列表的默认呈现将每个列表项放在一个新行上，并为其指定一个项目符号。

如何在getElementById（“ErrorTable”）中使用enter / br /或\ n。innerHTML？

2 个答案: