<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>添加商品</title>
<link href="../css/addProduct.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../js/AjaxFileUploaderV2.1/jquery.js"></script>
<script type="text/javascript" src="../js/addProduct.js"></script>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript" src="../js/AjaxFileUploaderV2.1/ajaxfileupload.js"></script>
<script type="text/javascript">
function setImagePreview(obj) {
var doc="doc"+obj;
var preview="preview"+obj;
var docObj = document.getElementById(doc);
var fon="obj"+obj;
var localImag="localImag"+obj;
var imgObjPreview = document.getElementById(preview);
if (docObj.files && docObj.files[0]) {
//火狐下,直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '85px';
imgObjPreview.style.height = '85px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();
//火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
} else {
//IE下,使用滤镜
docObj.select();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById(localImag);
//必须设置初始大小
localImagId.style.width = "85px";
localImagId.style.height = "85px";
//图片异常的捕捉,防止用户修改后缀来伪造图片
try {
localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
localImagId.filters
.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
} catch (e) {
alert("您上传的图片格式不正确,请重新选择!");
return false;
}
imgObjPreview.style.display = 'none';
document.selection.empty();
}
document.getElementById(fon).style.display="none";
return true;
}
</script>
</head>
<body οnlοad="loadData();">
<div class="mainFrame">
<form name="upLoadForm" id="upLoadForm" method="post" enctype="multipart/form-data">
<div class="shopInfo">
商品名称: <input type="text" name="commodity.comName" id="comName"
required="required" οninput="change1(this);">
<div id="shopName"></div>
</div>
<div><input type="hidden"
id="merNo" name="merchant.merNo"></div>
<div class="shopInfo">
商品库存: <input type="text" name="commodity.comRepertory"
id="comRepertory" οninput="change2(this);">
<div id="shopKc"></div>
</div>
<div class="shopInfo">
商品价格: <input type="text" name="commodity.comPrize" id="comPrize"
οninput="change3(this);">
<div id="shopPrice"></div>
</div>
<div class="product">
<div class="tpDesc">商品图片介 绍:</div>
<div class="comPrize">
<div class="div1" id="localImag1">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview1"">
<div id="fon1" class="font"><a id="obj1">添加商品</a></div>
<input type="file" id="doc1" οnchange="setImagePreview(1);"
name="image">
</div>
<div class="div1" id="localImag2">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview2"">
<div id="fon2" class="font"><a id="obj2">添加商品</a></div>
<input type="file" id="doc2" οnchange="setImagePreview(2);"
name="image">
</div>
<div class="div1" id="localImag3">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview3"">
<div id="fon3" class="font"><a id="obj3">添加商品</a></div>
<input type="file" id="doc3" οnchange="setImagePreview(3);"
name="image">
</div>
<div class="div1" id="localImag4">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview4"">
<div id="fon4" class="font"><a id="obj4">添加商品</a></div>
<input type="file" id="doc4" οnchange="setImagePreview(4);"
name="image">
</div>
<div class="div1" id="localImag5">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview5"">
<div id="fon5" class="font"><a id="obj5">添加商品</a></div>
<input type="file" id="doc5" οnchange="setImagePreview(5);"
name="image">
</div>
<div class="fontStyle">(建议尺寸: 640*640像素;您可以拖拽图片调整图片顺序。)</div>
</div>
</div>
<div class="type">
运费价格:<input type="text" class="input" name="commodity.comFreight"
id="comFreight" οninput="change4(this);"> 商品分类:
<!-- <input
type="text" class="input"> -->
<select name="commodity.comType" class="input" id="comType"
οninput="change5(this);">
<option value=''>-- 请选择商品分类 --</option>
</select>
<div id="shop"></div>
</div>
</form>
<div>
<input type="button" value="提交" id="tj">
</div>
</div>
</body>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>添加商品</title>
<link href="../css/addProduct.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../js/AjaxFileUploaderV2.1/jquery.js"></script>
<script type="text/javascript" src="../js/addProduct.js"></script>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript" src="../js/AjaxFileUploaderV2.1/ajaxfileupload.js"></script>
<script type="text/javascript">
function setImagePreview(obj) {
var doc="doc"+obj;
var preview="preview"+obj;
var docObj = document.getElementById(doc);
var fon="obj"+obj;
var localImag="localImag"+obj;
var imgObjPreview = document.getElementById(preview);
if (docObj.files && docObj.files[0]) {
//火狐下,直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '85px';
imgObjPreview.style.height = '85px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();
//火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
} else {
//IE下,使用滤镜
docObj.select();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById(localImag);
//必须设置初始大小
localImagId.style.width = "85px";
localImagId.style.height = "85px";
//图片异常的捕捉,防止用户修改后缀来伪造图片
try {
localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
localImagId.filters
.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
} catch (e) {
alert("您上传的图片格式不正确,请重新选择!");
return false;
}
imgObjPreview.style.display = 'none';
document.selection.empty();
}
document.getElementById(fon).style.display="none";
return true;
}
</script>
</head>
<body οnlοad="loadData();">
<div class="mainFrame">
<form name="upLoadForm" id="upLoadForm" method="post" enctype="multipart/form-data">
<div class="shopInfo">
商品名称: <input type="text" name="commodity.comName" id="comName"
required="required" οninput="change1(this);">
<div id="shopName"></div>
</div>
<div><input type="hidden"
id="merNo" name="merchant.merNo"></div>
<div class="shopInfo">
商品库存: <input type="text" name="commodity.comRepertory"
id="comRepertory" οninput="change2(this);">
<div id="shopKc"></div>
</div>
<div class="shopInfo">
商品价格: <input type="text" name="commodity.comPrize" id="comPrize"
οninput="change3(this);">
<div id="shopPrice"></div>
</div>
<div class="product">
<div class="tpDesc">商品图片介 绍:</div>
<div class="comPrize">
<div class="div1" id="localImag1">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview1"">
<div id="fon1" class="font"><a id="obj1">添加商品</a></div>
<input type="file" id="doc1" οnchange="setImagePreview(1);"
name="image">
</div>
<div class="div1" id="localImag2">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview2"">
<div id="fon2" class="font"><a id="obj2">添加商品</a></div>
<input type="file" id="doc2" οnchange="setImagePreview(2);"
name="image">
</div>
<div class="div1" id="localImag3">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview3"">
<div id="fon3" class="font"><a id="obj3">添加商品</a></div>
<input type="file" id="doc3" οnchange="setImagePreview(3);"
name="image">
</div>
<div class="div1" id="localImag4">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview4"">
<div id="fon4" class="font"><a id="obj4">添加商品</a></div>
<input type="file" id="doc4" οnchange="setImagePreview(4);"
name="image">
</div>
<div class="div1" id="localImag5">
<img src="../img/shop/13.jpg" width=85px height="66px"
id="preview5"">
<div id="fon5" class="font"><a id="obj5">添加商品</a></div>
<input type="file" id="doc5" οnchange="setImagePreview(5);"
name="image">
</div>
<div class="fontStyle">(建议尺寸: 640*640像素;您可以拖拽图片调整图片顺序。)</div>
</div>
</div>
<div class="type">
运费价格:<input type="text" class="input" name="commodity.comFreight"
id="comFreight" οninput="change4(this);"> 商品分类:
<!-- <input
type="text" class="input"> -->
<select name="commodity.comType" class="input" id="comType"
οninput="change5(this);">
<option value=''>-- 请选择商品分类 --</option>
</select>
<div id="shop"></div>
</div>
</form>
<div>
<input type="button" value="提交" id="tj">
</div>
</div>
</body>
</html>
css:
input[type="file"]{
filter:alpha(opacity=0); /*IE滤镜,透明度50%*/
-moz-opacity:0; /*Firefox私有,透明度50%*/
opacity:0;/*其他,透明度50%*/
position:absolute;
margin-left:-50px;
/*margin-top:65px;*/
width:90px;
z-index:10;
height:90px;
cursor:pointer;
margin-top:-120px;}