javascript - 如何使用javascript插入换行符?

标签 javascript html forms function appendchild

我的提交表单包含姓名、电子邮件和电话号码字段。当然,我想在三者之间插入换行符。我试图在所有三个之间插入一个换行符,但只在表单末尾生成一个换行符,而我的代码应该附加 3 个换行符,而不是一个。

生成的 View 源显示如下:

<label>Name: </label><input required="" name="fullName" type="text"><label>Email: </label>   <input required="" name="email" type="text"><label>Phone Number: </label><input required="" name="phoneNumber" type="text"><br><input value="Submit Query" type="submit"></form>

生成此表单的 Javascript 代码:

function queryForm()
{
    var queryBox = document.getElementById("queryBox").style.display = "block";
    var queryForm = document.getElementById("queryForm");
    var linebreak = document.createElement("br");

    var lblName = document.createElement("label");
    lblName.textContent = "Name: ";
    queryForm.appendChild(lblName);

    var fullName = document.createElement("input");
    fullName.name = "fullName";
    fullName.type = "text";
    fullName.required = "required";
    queryForm.appendChild(fullName);
    queryForm.appendChild(linebreak);


    var lblEmail = document.createElement("label");
    lblEmail.textContent = "Email: ";
    queryForm.appendChild(linebreak);
    queryForm.appendChild(lblEmail);

    var email = document.createElement("input");
    email.name = "email";
    email.type = "text";
    email.required = "required";
    queryForm.appendChild(email);


    var lblPhoneNumber = document.createElement("label");
    lblPhoneNumber.textContent = "Phone Number: ";
    queryForm.appendChild(linebreak);
    queryForm.appendChild(lblPhoneNumber);

    var phoneNumber = document.createElement("input");
    phoneNumber.name = "phoneNumber";
    phoneNumber.type = "text";
    phoneNumber.required = "required";
    queryForm.appendChild(phoneNumber);


    var submitQuery = document.createElement("input");
    submitQuery.type = "submit";
    submitQuery.value = "Submit Query";
    queryForm.appendChild(linebreak);
    queryForm.appendChild(submitQuery);
}

最佳答案

您应该创建新的 <br>每次附加它时标记,例如

linebreak = document.createElement("br");
queryForm.appendChild(linebreak);

DEMO

关于javascript - 如何使用javascript插入换行符?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22272623/

相关文章:

javascript - 在 php 表单提交之前添加电子邮件验证

php - 在文本文件中打印 mysql_query

javascript - 不使用 Jquery 查找最后一个 td

Javascript : Cant get divs to align properly

jquery - 根据其他 div 的位置更改 div 的背景颜色

html - 我在第三排按钮前面有额外的空间

javascript - 如何使用 if 语句使用 jquery 显示和隐藏 2 div?

javascript - Vue 组件没有正确更新属性

javascript - 如何获取数组中 "key"的值-Javascript

javascript - PHP Javascript 更改浏览器后退按钮行为 Laravel