如何使用JavaScript插入换行符?

神奇骑士

我拥有的提交表单具有名称,电子邮件和电话号码字段。当然,我想在三个之间插入换行符。我尝试在所有三个之间插入一个换行符,但是仅在表单末尾生成一个换行符,此时我的代码应附加三个换行符,而不是一个。

生成的视图源显示以下内容:

<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);

演示

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用jQuery插入换行符

来自分类Dev

如何使用JavaScript删除html标签并保留换行符?

来自分类Dev

使用JavaScript删除HTML换行符

来自分类Dev

IMPORTHTML插入换行符

来自分类Dev

如何使用\ b删除换行符

来自分类Dev

如何使用Ultraedit删除换行符?

来自分类Dev

如何使用\ b删除换行符

来自分类Dev

如何使用Ultraedit删除换行符?

来自分类Dev

如何使用scanf获取换行符?

来自分类Dev

如何使用iTextSharp引入换行符

来自分类Dev

如何使用.setattribute()添加换行符?

来自分类Dev

如何使用PHP显示换行符?

来自分类Dev

使用JavaScript将换行符插入HTML textContent属性(特定于IE)

来自分类Dev

如何使用CSS在元素之后但不在元素之前插入换行符?

来自分类Dev

如何在不使用XAML的情况下将换行符插入TextBlock?

来自分类Dev

如何使用gui builder在codenameone按钮上为长文本插入换行符

来自分类Dev

如何在组件名称中插入换行符?

来自分类Dev

如何将换行符插入字符数组

来自分类Dev

如何将换行符插入Stata宏变量?

来自分类Dev

如何为长文本插入换行符?

来自分类Dev

如何在字符数组中插入换行符

来自分类Dev

如何在C语言的Recv中插入换行符

来自分类Dev

如何在Word交叉引用中插入换行符

来自分类Dev

如何在插入的文本中包含换行符

来自分类Dev

使用sed的不带换行符的追加/更改/插入

来自分类Dev

在SpriteKit中使用SKLabelNode插入换行符

来自分类Dev

在SpriteKit中使用SKLabelNode插入换行符

来自分类Dev

使用Cat将换行符插入文本输出中

来自分类Dev

如何检测换行符?