bootstrap+fontawesome实现文件上传

css

	  .function .upload {
            overflow: hidden;
        }

         .function .upload input {
            opacity: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            width: 76px;
            left: -2px;
            overflow: hidden;

html上传按钮，bootstrap+fontawesome样式

<div class="function">
	<div class="btn btn-primary btn-xs upload" style="position: relative">
   		 <div><i class="fa fa-upload" aria-hidden="true"></i> 上传文件</div>
   		 <input type="file" multiple name="uploadFile" id="uploadFile">
   </div>
</div>

js

   $(function () {
            bindUploadFile();
        });
        function bindUploadFile() {
            // change绑定
            $('#uploadFile').change(function () {
                var fileList = $(this)[0].files; 
                #获取所有上传文件
                $.each(fileList,function (index,fileObject) {
                    console.log(fileObject.name,fileObject.size)
                    # 得到文件名称，以及大小
                })
            })
            
        }