Javascript添加文件输入框按钮麻烦

时间:2014-11-21 19:55:51

标签: javascript function upload element

我正在构建一个多文件上传器,并希望使用java脚本在
的新行上启动每个输入。

我要做的是在彼此之下开始每个新盒子而不是彼此相邻排列。有人可以告诉我要添加到java脚本的内容,以便创建一个元素

我尝试将这些添加到javascript函数的末尾,但它没有工作

var txt = document.createElement('br');
AND
txt = document.createElement('br');
AND
txt.element ="<br>";

我有一个多重上传器代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title> :: FILEUPLOAD :: </title>
</head>

<body>
<form name="form" method="post" enctype="multipart/form-data">
  <div id="files">
      <input type="file" name="item_file[]">
  </div>
  <a href="javascript:_add_more();" title="Add more">+</a>
</form>

<script language="javascript">
<!--
function _add_more() {
    var txt = document.createElement('input');
    txt.type="file";
    txt.name="item_file[]";
    document.getElementById("files").appendChild(txt);
}
</script>
</body>
</html>

感谢您的帮助

1 个答案:

答案 0 :(得分:1)

为每个输入添加一个类:

function _add_more() {
  var txt = document.createElement('input');
  txt.type="file";
  txt.name="item_file[]";
  txt.className="file-picker";
  document.getElementById("files").appendChild(txt);
}

然后将display:block添加到您的css类:

input.file-picker
{
  display: block
}

fiddle中的工作版本。

编辑:您可能还想在CSS类中添加底部填充。