-
<%@Language=JScript @CodePage=936%>
-
<Script Language=JScript RunAt=Server>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
</Script>
-
<SCRIPT RUNAT=Server LANGUAGE=JScript>
-
</SCRIPT>
-
<HTML>
-
<HEAD>
-
<TITLE>JScript Example Form</TITLE>
-
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312" />
-
</HEAD>
-
<STYLE>
-
button
-
{
-
border:1px gray solid;
-
}
-
div.form_item
-
{
-
width:500px;
-
overflow-x:visible;
-
padding:4px;
-
margin-top:8px;
-
border:2px gray dotted;
-
}
-
input.file
-
{
-
border:1px gray inset;
-
width:400px;
-
}
-
textarea.info
-
{
-
border:1px gray inset;
-
width:400px;
-
SCROLLBAR-FACE-COLOR: #cccccc;
-
SCROLLBAR-HIGHLIGHT-COLOR: WHITE;
-
SCROLLBAR-SHADOW-COLOR: WHITE;
-
SCROLLBAR-ARROW-COLOR: maroon;
-
SCROLLBAR-TRACK-COLOR: #e0e4e4;
-
SCROLLBAR-3DLIGHT-COLOR: #cccccc;
-
SCROLLBAR-DARKSHADOW-COLOR: #cccccc;
-
SCROLLBAR-BASE-COLOR: #cccccc;
-
}
-
</STYLE>
-
<SCRIPT>
-
var countImgLoading=0;
-
function GetItemDiv(e)
-
{
-
while(e=e.parentElement)
-
{
-
if(e.className.toLowerCase()=="form_item")
-
{
-
return e;
-
}
-
}
-
throw(new Error(-1,"Impossible:GetItemDiv发生不能处理的意外"));
-
}
-
function GetNamedItem(div,name)
-
{
-
return div.all(name);
-
throw(new Error(-11,"Impossible:GetNamedItem发生不能处理的意外"+name));
-
}
-
function Check_Item(div)
-
{
-
var file=GetNamedItem(div,"file");
-
var info=GetNamedItem(div,"info");
-
var width=GetNamedItem(div,"width");
-
var height=GetNamedItem(div,"height");
-
var preview=GetNamedItem(div,"preview");
-
if(file.value.replace(/\s/g,"")=="")
-
{
-
file.focus();
-
return false;
-
}
-
if(info.value.replace(/\s/g,"")=="")
-
{
-
info.focus();
-
return false;
-
}
-
if(info.value.length>1000)
-
{
-
alert("描述的长度不能超过1000字");
-
info.focus();
-
return false;
-
}
-
if(height.value=="0"||width.value=="0")
-
{
-
file.focus();
-
return false;
-
}
-
if(parseInt(height.value)>800||parseInt(width.value)>600)
-
{
-
alert("图片尺寸大于800X600");
-
file.focus();
-
return false;
-
}
-
if(preview.src.toLowerCase().indexOf("file://")!=0)
-
{
-
alert("只能上传本地文件！！\n请把文件框的内容清楚\n然后按浏览");
-
file.focus();
-
return false;
-
}
-
if(preview.fileSize==0)
-
{
-
file.focus();
-
return false;
-
}
-
return preview.fileSize;
-
}
-
function Check_Form()
-
{
-
if(event==null)var event=new Object();
-
var totalSize=0;
-
var haveItem=false;
-
var coll=form_submit.children;
-
for(var i=0;i<coll.length;i++)
-
{
-
var item=coll.item(i);
-
if(item.className.toLowerCase()=="form_item")
-
{
-
haveItem=true;
-
totalSize=Check_Item(item);
-
if(totalSize==false)
-
{
-
alert("该输入框必须填上正确的内容");
-
return event.returnValue=false;
-
}
-
}
-
}
-
if(haveItem==false)
-
{
-
Add_FormItem();
-
return event.returnValue=false;
-
}
-
if(totalSize==0)
-
{
-
alert("不打算上传了");
-
return event.returnValue=false;
-
}
-
if(totalSize>1024*1024)
-
{
-
alert("不能上传超过1M的数据");
-
return event.returnValue=false;
-
}
-
btn_submit.disabled=true;
-
return event.returnValue=true;
-
}
-
function Add_FormItem()
-
{
-
form_submit.elements("input_submit").insertAdjacentHTML("beforebegin",form_template.innerHTML);
-
}
-
function Delete_FormItem()
-
{
-
var btn=event.srcElement;
-
GetItemDiv(btn).removeNode(true);
-
}
-
function Show_Preview()
-
{
-
var div=GetItemDiv(event.srcElement);
-
var preview=GetNamedItem(div,"preview");
-
var file=GetNamedItem(div,"file");
-
if(preview.readyState=="uninitialized"||preview.readyState=="complate")countImgLoading++;
-
btn_submit.disabled=true;
-
preview.src=file.value;
-
}
-
function OnPreviewLoad(secceed)
-
{
-
btn_submit.disabled=false;
-
countImgLoading--;
-
var div=GetItemDiv(event.srcElement);
-
var preview=GetNamedItem(div,"preview");
-
var height=GetNamedItem(div,"height");
-
var width=GetNamedItem(div,"width");
-
if(secceed)
-
{
-
height.value=preview.height;
-
width.value=preview.width;
-
}
-
else
-
{
-
height.value=width.value="0";
-
}
-
var filesize=GetNamedItem(div,"filesize");
-
filesize.innerText=Math.floor(preview.fileSize/1024)+"K";
-
}
-
function OnPreviewMouseOver(div)
-
{
-
if(div.contains(event.fromElement))return;
-
var divItem=GetItemDiv(div);
-
var preview=GetNamedItem(divItem,"preview");
-
div.style.overflow="visible";
-
preview.style.position="absolute";
-
}
-
function OnPreviewMouseOut(div)
-
{
-
if(div.contains(event.toElement))return;
-
var divItem=GetItemDiv(div);
-
var preview=GetNamedItem(divItem,"preview");
-
div.style.overflow="hidden";
-
preview.style.position="static";
-
}
-
function OnPreviewClick(div)
-
{
-
var divItem=GetItemDiv(event.srcElement);
-
var preview=GetNamedItem(divItem,"preview");
-
div.style.overflow="hidden";
-
preview.style.position="static";
-
}
-
</SCRIPT>
-
<BODY>
-
<DIV>
-
<BUTTON ID="btn_add">添加一个需要上传的图片</BUTTON>
-
<BUTTON ID="btn_submit">提交所有内容</BUTTON>
-
</DIV>
-
<DIV>
-
<FORM ID="form_submit" ACTION="e.g.jscript.action.asp" METHOD="POST" ENCTYPE="multipart/form-data" ONSUBMIT="Check_From()">
-
<INPUT ID="input_submit" TYPE="submit" STYLE="display:none">
-
</FORM>
-
</DIV>
-
-
<FORM ID="form_template" STYLE="display:none;">
-
<DIV CLASS="form_item">
-
<DIV>
-
要上传图片(<SPAN id="filesize"></SPAN>)的路径： <BUTTON CLASS="delete" ONCLICK="Delete_FormItem()">删除</BUTTON>
-
</DIV>
-
<DIV STYLE="border:1px orange solid;width:200px;height:50px;overflow:hidden;" ONMOUSEOVER="OnPreviewMouseOver(this)" ONMOUSEOUT="OnPreviewMouseOut(this)" ONCLICK="OnPreviewClick(this)">
-
<INPUT TYPE="hidden" NAME="width" VALUE="0">
-
<INPUT TYPE="hidden" NAME="height" VALUE="0">
-
<IMG ID="preview" STYLE="position:static" ONLOAD="OnPreviewLoad(true)" ONERROR="OnPreviewLoad(false)">
-
</DIV>
-
<DIV>
-
<INPUT TYPE="file" NAME="file" CLASS="file" ONCHANGE="Show_Preview()">
-
</DIV>
-
<DIV>
-
相关的描述：
-
</DIV>
-
<DIV>
-
<TEXTAREA NAME="info" CLASS="info" ROWS="4"></TEXTAREA>
-
</DIV>
-
</DIV>
-
</FORM>
-
</BODY>
-
<SCRIPT>
-
Add_FormItem();
-
function btn_add.onclick()
-
{
-
Add_FormItem();
-
}
-
function btn_submit.onclick()
-
{
-
if(Check_Form())
-
form_submit.submit();
-
}
-
</SCRIPT>
-
</HTML>
