理想是火,点燃熄灭的灯。
<form action='uploadFile.php' enctype="multipart/form-data" type='post'> <input type='file'> <input type='hidden' name='userid'> <input type='hidden' name='signature'> <button>提交</button> </form>
注:form表单里发送除文件外的数据,一般是新建一个type=hidden的input,value=‘需要传的数据’,每发送一个数据就需要一个input(相当于参数)
$("#fileContent").change(function(){ // 获取到file对象 var file = this.files[0] // 声明FileReader实例化对象 var fr = new FileReader() // 使用实例化对象的readAsDataURL API放入file对象 fr.readAsDataURL(file) // 最后通过实例化对象的onload事件 获取文件详细属性 fr.onload = function (event) { var data= event.target.result // 如果是图片则是base64 不然就是blob对象 console.log(data) } })
$("input[type='button']").on('click', upfile); function upfile() { var formData = new FormData(); formData.append("接收字段1", document.getElementById('file1').files[0]); formData.append("接收字段2", document.getElementById('file2').files[0]); $.ajax({ url: '接口地址url', type: 'POST', data: formData, // 上传formdata封装的数据包 dataType: 'JSON', cache: false, // 不缓存 processData: false, // jQuery不要去处理发送的数据 contentType: false, // jQuery不要去设置Content-Type请求头 success: function(data) { // 成功回调 console.log(data); } }) }
如果没有使用JQ 而是原生的input file上传文件只需要:
html:
<input type="file" onchange="fileChange(event)" />
JS:
function fileChange(e) { let file = e.target.files[0]; console.log(file.lastModified); console.log(file.lastModifiedDate); console.log(file.name); console.log(file.size); console.log(file.type); console.log(file.webkitRelativePath); }
作者: Bill 本文地址: http://biaoblog.cn/info?id=1569400620000
版权声明: 本文为原创文章,版权归 biaoblog 个人博客 所有,欢迎分享本文,转载请保留出处,谢谢!