javascript - 在新行中动态添加更多文本字段 (html)

标签 javascript html dom

我使用了 http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/ 中的代码html-javascript/.我的代码是这样的:

<HTML>
<HEAD>
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
<SCRIPT language="javascript">
function add() {

    for (i=1; i<=5; i++)
      {
        //Create an input type dynamically.
        var element = document.createElement("input");
     
        //Assign different attributes to the element.
        element.setAttribute("type", i);
        element.setAttribute("name", i);
        element.setAttribute("value", i);
     
     
        var foo = document.getElementById("fooBar");
     
        //Append the element in page (in span).
        foo.appendChild(element);
      }

 
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<H2>Dynamically add element in form.</H2>
Select the element and hit Add to add it in form.
<BR/>
<INPUT type="button" value="Add" onclick="add()"/>
     
<span id="fooBar">&nbsp;</span>
     
</FORM>
</BODY>
</HTML>

该代码有效。但我不想水平添加它,而是希望每个新文本字段都添加到新行中。我尝试使用 </script><br/><script> , <html><br/></html> , document.write("\n") ,和document.write("\r\n")在循环函数中,但它不像我想要的那样工作。我该怎么办?

最佳答案

为什么不这样做呢?

var br = document.createElement("br");
foo.appendChild(br);

关于javascript - 在新行中动态添加更多文本字段 (html),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12224823/

相关文章:

javascript - 物化路径中的对象

javascript - jquery相当于在html元素上查找某些属性的值

javascript - fs 读取错误 : EISDIR: illegal operation on a directory,

javascript - 如何选择单个 div 并在 jquery 中独立于其他元素对其及其相关元素进行动画处理

html - V 对齐顶部在 TD 内不起作用

javascript - javascript触发对话框打开时如何使IE8/9提交输入类型="file"

javascript - jQuery .val 更改不会更改输入值

html - 仅在一个 div 上阻止来自单个样式表的样式

javascript - 向 DOM 元素添加变量

JAVA DOM XML 解析