兼容工业管理学(工业工程)和消防的图片上传前预览射流研究…代码

效果图如下

代码如下：复制代码代码如下：DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8'/title本地图片预览/title style type=' text/CSS ' # preview { width :100 px；高度：100 pxborder:1px固体# 000;飞越：隐藏；} # imghead { filter : progid : maximagettransform .微软。alpha imageloader(大小调整方法=image)；}/样式脚本类型='text/javascript '函数预览图像(文件){ var MAXWIDTH=100var MAXHEIGHT=100 var div=document。getelementbyid('预览')；if(文件。文件文件。文件[0]){ div。innerhtml=' img id=imgheadvar img=文档。getelementbyid(' imghead ')；img。onload=function(){ var rect=clacImgZoomParam(MAXWIDTH，MAXHEIGHT，img.offsetWidth，img。右偏)；img。宽度=矩形。宽度；img。高度=矩形。身高；img。风格。左边距=矩形。左“px”；img。风格。margintop=rect。顶部“px”；} var reader=new FileReader()；读者。onload=function(evt){ img。src=evt。目标。结果；}读者。readasdataurl(文件。文件[0])；} else { var s filter=' filter : progid : maximagettransform .微软。AlphaimageLoader(sizing method=scale，src=' http:file。select()；var src=文档。选择。创建范围().文本；div . innerHTMl=' img id=imgheadvar img=document。getelementbyid(' imghead ')；img。过滤器。项目(' dximagettransform .微软。alpha imageloader’).src=src var rect=ClacimgZoomparam(MAXWEIGHT，MAXHEIGHT，img.offsetWidth，img。右偏)；status=('rect:' rect.top '，' rect.left '，' rect.width '，' rect。高度’)；div。inner html=' div id=div head style=' width : ' rect。宽度' px；高度： '直角.高度' pxmargin-顶部： '直角。top ' px边距-往左：英尺。“左”px；s筛选器src ' \ ' '/div '；} }函数clacImgZoomParam(maxWidth，maxHeight，Width，height ){ var param={top:0，left:0，width:width，height : height }；if(width MaxWidth | | heightmmaxH8){ rate width=width/MaxWidth；rateHeight=高度/最大高度；if(速率宽度速率高度){ param。width=maxWidthparam.height=Math.round(高度/比率宽度);} else { param。宽度=数学。圆形(宽度/比率高度)；param.height=maxHeight} } param。左=数学。round((MaxWidth-param。宽度)/2)；帕拉姆。top=数学。round((maxHeight-param。高度)/2)；返回参数；}/script/head body div id=' preview ' img id=' imghead ' width=100 height=100 border=0 src='./images/head 01 _ big。jpg '/div br/输入类型=' file ' on change=' previewitimage(this)'//body/html