<head>
<style>
.pro_img{ margin-left:10px;margin-top:10px;width:300px;height: 300px;background-color: black; --border-radius:999em; overflow:hidden;float:left; --margin:5% 35%;position: relative;}
.pro_img img{ position: absolute;left: 50%;top:50%; transform: translate(-50%,-50%);width: 100%
}
.pro_img {position:relative}
.pro_img input{position: absolute;width: 100%;height: 100%;margin:0;opacity:0;z-index: 100;}
</style>
<script type=
"text/javascript"
src=
"jquery.min.js"
></script>
<script>
name_pic=1;
function
t1(o){
if
(o==1 || name_pic!=1){
var
file=
"file"
+o;
var
img=
"img"
+o;
var
hid=
"hidden"
+o;
var
aa=
"a"
+o;
}
else
{
var
file=
"file"
+name_pic;
var
img=
"img"
+name_pic;
var
hid=
"hidden"
+name_pic;
var
aa=
"a"
+name_pic;
}
var
docObj = document.getElementById(file);
var
imgObjPreview = document.getElementById(img);
var
hidden=document.getElementById(hid);
if
(docObj.files && docObj.files[0]) {
hidden.src=window.URL.createObjectURL(docObj.files[0]);
hidden.onload=
function
(){
var
width=hidden.width;
var
height=hidden.height;
var
a=document.getElementById(aa);
if
(width>height){
imgObjPreview.style.cssText=
'width:100%'
;
}
else
{
imgObjPreview.style.cssText=
'height:100%;width:auto;'
;
}
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
imgObjPreview.style.display =
'block'
;
}
}
else
{
return
false;
}
if
(o==name_pic){
var
count
=$(
'.pro_img'
).length;
if
(
count
<6){
name_pic++;
var
pic_p=
"<a class='pro_img' id='a"
+name_pic+
"' ><input type='file' id='file"
+name_pic+
"' accept='image/*' multiple='multiple' name='pic[]' onchange='t1("
+name_pic+
")'/><img src='upload.jpg' id='img"
+name_pic+
"'></a><img id='hidden"
+name_pic+
"' style='display:none;'>"
;
$(
'#upload'
).append(pic_p);
}
}
}
</script>
</head>
<!-- multiple=
'multiple'
-->
<form action=
"http://192.168.0.7/index.php/Home/Pic/upload"
enctype=
"multipart/form-data"
method=
"post"
>
<p id=
'upload'
>
<a
class
=
'pro_img'
id=
'a1'
>
<input type=
'file'
id=
'file1'
accept=
'image/*'
multiple=
'multiple'
name=
'pic[]'
onchange=
't1(1)'
/>
<img src=
'upload.jpg'
id=
'img1'
></a>
<img id=
'hidden1'
style=
'display:none;'
>
</p>
<input type=
'submit'
value=
"上传"
/>
</form>