js 動態新增多表單控制元件 div
<script type="text/javascript">
var p=1;
function CreateUpload()
{
p++;
var div=document.createElement('div');
var html='<img id=img_view'+p+' style="width: 90px; height: 90px; float: left;margin: 5px;display:none;" />'
+ '<div style="float: left;">'
+' 型別：<select name="types" id="types'+p+'"><option value="1">榮譽證書</option><option value="2">環境風光</option>'
+'<option value="3">公共設施</option><option value="4">溫馨臥室</option><option value="5">精彩活動</option></select><br />'
+' 標題：<input type="text" name="imgTitle" id="imgTitle'+p+'" size="30" value="" /><br />'
+' 圖片：<input type="text" readonly="readonly" id="ReviewPic'+p+'" name="ReviewPic" value="" style="width: 270px;" />'
+'<input type="button" value="我要上傳" onclick="document.getElementByIdx_x_x(\'frmReviewPic'+p+'\').style.display=(document.getElementByIdx_x_x(\'frmReviewPic'+p+'\').style.display == \'\' ? \'none\' : \'\')" />'
+'<iframe name="frmReviewPic" id="frmReviewPic'+p+'" frameborder="0" cellpadding="0" width="480"'
+' height="30" scrolling="no" src="../uploadfile.aspx?space=0&bgcolor=e6eff8&size=35&input=ReviewPic'+p+'"'
+'bgcolor="#ffffff" style="display: none"></iframe><br />'
+'描述：<textarea cols="60" rows="2" name="Description" id="Description'+p+'" class="inputtext"></textarea><a href="javascript:" onclick="RemoveAdd('+p+')">[-]刪除</a></div>';
div.innerHTML=html;
div.style.width="780px";
div.style.marginTop="10px";
div.setAttribute("id","upDiv"+p);
//div.id="upDiv"+p;
document.getElementById('uppics').appendChild(div);
}
function sub()
{
var ReviewPic=document.getElementsByName("ReviewPic");
var Description=document.getElementsByName("Description");
var imgTitle=document.getElementsByName("imgTitle");
//alert(o.length);
for(var i=0;i<ReviewPic.length;i++)
{
if(imgTitle[i].value=="")
{
alert("您有沒有標題的圖片上傳，請填寫標題！");
imgTitle[i].focus();
return false;
}
if(imgTitle[i].value.length>15)
{
alert("第"+(i+1)+"張圖片的標題過長，請您更正！");
imgTitle[i].focus();
return false;
}
if(ReviewPic[i].value=="")
{
alert("第"+(i+1)+"張圖片沒有上傳！");
return false;
}
}
return true;
}
function RemoveAdd(id)
{
var div=document.getElementById('upDiv'+id);
var div2=document.getElementById('uppics');
div2.removeChild(div);
}
</script>
<html>
<head>
</head>
<body>
<div style="width: 100%;" id="uppics">
<div style="width: 100%;" id="upDiv1">
<img id="img_view1" style="width: 90px; height: 90px; float: left; margin: 5px; display: none;" />
<div style="float: left;">
型別：<select name="types" id="types1"><option value="1">榮譽證書</option>
<option value="2">環境風光</option>
<option value="3">公共設施</option>
<option value="4">溫馨臥室</option>
<option value="5">精彩活動</option>
</select><br />
標題：<input type="text" name="imgTitle" id="imgTitle1" value="" size="30" /><br />
圖片：<input type="text" readonly="readonly" id="ReviewPic1" name="ReviewPic" value="" style="width: 270px;" />
<input type="button" value="我要上傳" onclick="document.getElementByIdx_x_x('frmReviewPic1').style.display=(document.getElementByIdx_x_x('frmReviewPic1').style.display == '' ? 'none' : '')" />
<iframe name="frmReviewPic" id="frmReviewPic1" frameborder="0" cellpadding="0" width="480"
height="30" scrolling="no" src="../uploadfile.aspx?space=0&bgcolor=e6eff8&size=35&input=ReviewPic1"
bgcolor="#ffffff" style="display: none"></iframe>
<br />
描述：<textarea cols="60" rows="2" name="Description" id="Description1" class="inputtext"></textarea>
</div>
<input style="float: left;" class="botton" type="button" onclick="CreateUpload()"
value="[+]繼續新增" />
</div>
</div>
</body>
<html>