js+ajax 上传单图片

//单图片上传
$('#cover').on('change',function(){ var filePath = $(this)[0].files[0].name //获取到input的value,里面是文件的路径 var fileFormat = filePath.split('.')[1].toLowerCase() // 检查是否是图片 if( !fileFormat.match(/png|jpg|jpeg/) ) { alert('上传错误,文件格式必须为:png/jpg/jpeg') return } var formData = new FormData(); formData.append('upfile', $(this)[0].files[0]); //添加图片信息的参数 $.ajax({ url: "/upload", //自己的路径 type: "post", dataType: "json", cache: false, mimeType: "multipart/form-data", data: formData, processData: false,// 不处理数据 contentType: false, // 不设置内容类型 async:false, success:function (result){ $('#smallCover').attr('src',result) $('#x_thumb').val(result) } }); });
<div style="display:flex;margin-bottom:20px;">
     <input type="text" readonly placeholder="请选择图片" class="form-control col-sm-6" id="s_idcard" name="s_idcard" value="{$items['s_idcard']}"> 
     <input type="text" style="width: 100px;" readonly value="请选择图片" class="btn btn-default" >
     <input type="file" id="cover" name="cover" class="btn btn-default" style="width: 100px;height:35px;line-height:85px;position: absolute;right: 15px;z-index: 1;background: transparent;" />
</div>
<img id="smallCover" width=150 mode="widthFix" src="{$items['s_idcard']}">
posted @ 2020-05-29 11:09  怂的一批的蜗牛  阅读(542)  评论(0编辑  收藏  举报