2、重新销毁创建:如果只改变了子组件的数据,但是子组件没有重新渲染,那么可以重新创建一下这个子组件,其实也就是v-if一下。
<!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/htmlcharset=utf-8" />
<title>无标题文档</title>
<script>
var i=1
function add(){
var top=document.getElementById("top")
var input=document.createElement("input")
var div=document.createElement("div")
div.innerHTML="学生:"+i
div.id=i
i=i+1
input.type="text"
input.name="v"
input.onclick=function remo(){alert(i)top.removeChild(div)}//点击删除控件
input.value="nihao"
input.id="v"
div.appendChild(input)
top.appendChild(div)
}
</script>
</head>
<body>
<div><input type="button" onclick="add()" value="添加" /></div>
<div id="top"></div>
</body>
</html>
首先,你的file控件要放到form表单内,其次,每个file控件的name属性应该不同。下面是我修改后的:
<html>
</head>
<script language="javascript" type="text/ecmascript">
var x=1
//======================
//功能:在表单中input file控件
//参数:parentID---要插入input file控件的父元素ID
// inputID----input file控件的ID
//======================
function createInput(parentID,inputFileID){
var parent=$(parentID)//获取父元素
var div=document.createElement("div")//创建一个div容器用于包含input file
x++
var divName=inputFileID+x//随机div容器的名称
div.id=divName
var aElement=document.createElement("input")//创建input
aElement.name=divName
aElement.type="file"//设置类型为file
var delBtn=document.createElement("input")//再创建一个用于删除input file的Button
delBtn.type="button"
delBtn.value="删除"
delBtn.onclick=function(){ removeInput(parentID,divName)}//为button设置onclick方法
div.appendChild(aElement)//将input file加入div容器
div.appendChild(delBtn)//将删除按钮加入div容器
parent.appendChild(div)//将div容器加入父元素
}
//============================
//功能:删除一个包含input file的div 容器
//参数:parentID---input file控件的父元素ID
// DelDivID----个包含input file的div 容器ID
//============================
function removeInput(parentID,DelDivID){
var parent=$(parentID)
parent.removeChild($(DelDivID))
}
//通过元素ID获取文档中的元素
function $(v){return document.getElementById(v)}
</script>
<body>
<form action="test.php" method="post" enctype="multipart/form-data">
<div align="left" id="div_Pic" style="border:1px solid #CCCCCC">
<input name="PicFile" type="file" id="ShowPicFile">
</div>
<input type="button" onClick="createInput('div_Pic','PicFile')" name="button" id="button" value="+ 继续添加图片">
<input type="submit" value="提交">
</body>
</html>
然后php就可以通过遍历$_FILES来获得每个上传的文件。下面的简单例子只是列出每个文件的原文件名:
<?php
forEach($_FILES as $f){
echo $f["name"]."<br>"
}
?>