HTML의 input 태그가 file 형식일 때 업로드된 파일의 이름을 단추에 표시합니다
5658 단어 분류하기 귀찮다
<a href="javascript:;" class="a-upload">
<div id="shangchuan" onchange="successload()">
div>
// onchange onclick,onclick , onchange
<script>
var filename = document.getElementById('file');
function getfilename(){
if(filename.files[0] == undefined){
alert(' !');
}
else{
//alert(' !');
document.getElementById('shangchuan').innerHTML=filename.files[0].name;
}
}
script>
css 스타일은 다음과 같습니다.http://www.haorooms.com/post/css_input_uploadmh
.a-upload {
padding: 4px 10px;
height: 20px;
line-height: 20px;
position: relative;
cursor: pointer;
color: #888;
background: #fafafa;
border: 1px solid #ddd;
border-radius: 4px;
overflow: hidden;
display: inline-block;
*display: inline;
*zoom: 1
}
.a-upload input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
filter: alpha(opacity=0);
cursor: pointer
}
.a-upload:hover {
color: #444;
background: #eee;
border-color: #ccc;
text-decoration: none
}