动态添加图片的前端实现-优快云博客

<!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=utf-8" />
		<meta name="Keywords" content="" />
		<meta name="Description" content="" />
		<title>
			动态添加图片
		</title>
		<script type="text/javascript">
			function addimg() {
				//包含所有文件域的DIV
				var div = document.getElementById('imgs');
				//文件域
				var input = document.createElement("input");
				input.name = "img[]";
				input.type = 'file';
				//添加
				div.appendChild(input);
				//删除按钮
				var button = document.createElement("a");
				button.href = "javascript:;";
				button.innerHTML = '删除';
				div.appendChild(button);
				//换行
				var br = document.createElement("br");
				div.appendChild(br);
				//在按钮上增加删除的事件
				button.onclick = function() {
					input.parentNode.removeChild(input);
					this.parentNode.removeChild(this);
					br.parentNode.removeChild(br);
				}
			}
		</script>
	</head>
	<body>
		<form method="POST" enctype="multipart/form-data" action="upload.php">
			请选择图片：
			<div id="imgs">
				<input type="file" name="img[]" />
				<br/>
			</div>
			<input type="button" onclick="addimg()" value="增加" />
		</form>
	</body>

</html>
DD; optionsClear(e); for (var i = 1; i
< (n + 1); i++) e.options.add(new Option( " " + i + " 日", i)); } function
IsPinYear(year) //判断是否闰平年 { return (0==y ear % 4 && (year % 100 !=0 ||
year % 400==0 )); } function optionsClear(e) { e.options.length=1 ; } //-->
	</script>
	</body>
	
	</HTML>