生成具有特定类的文本字段

时间:2013-07-15 10:34:55

标签: javascript html css

在下面的HTML和JavaScript代码中,我希望在单击按钮时动态添加文本字段和单选按钮。这工作正常。但我也希望生成的新文本字段应该具有与上面相同的字体大小和外观,即我希望拥有相同的类。

这是HTML:

<input type="radio" name="choices"  value="o1"/>
<input type="text" name="o1" id="o1" class="inputtype"/>
<span class="file-wrapper">
<input type="file" name="o1_i" />
<span class="button">Choose an file</span>
</span>
<div id="responce"></div>

JavaScript:

var div = document.getElementById("responce");
var radio = document.createElement("input");
            radio.type = "radio";
            radio.name = "choices";
            radio.value = "o" + countBox;
            div.appendChild(radio);

var text = document.createElement("input");
            text.type = "text";
            text.id = "o" + countBox;
            text.name ="o" + countBox;
            div.appendChild(text);

var upload = document.createElement("input")
            upload.type = "file";
            upload.name= "o" + countBox + "_i";
            div.appendChild(upload);

2 个答案:

答案 0 :(得分:4)

只需设置className属性的方式与设置名称,类型和ID的方式相同:

text.className = "inputtype";

对浏览按钮执行相同的操作:

upload.className = "someclass";

对于多个类,请用空格分隔它们。请注意,className会覆盖整个班级列表。

答案 1 :(得分:0)

如果您不想为添加的每个项目添加javascript的课程。只需定位<input>元素并使用普通css#myform input[type=text],前提是您有form-tag或某些父元素要定位。