wordpress 滑块黄冈网站推广优化找哪家
查看下载地址:http://www.cnblogs.com/52fhy/p/5355601.html
查看input[type='file']的图片路径。在我的另一篇博客:http://blog.csdn.net/qq_33769914/article/details/54705820
而这篇文章可以说是综合性的,用了这个插件方法就也是可以获取图片路径的,并且还压缩了。所以这样就淘汰原来方法。更加好啦。
希望在上传的时候获取图片并压缩他,之后上传至服务器。
<script src="./dist/lrz.all.bundle.js"></script> //这里加载的这个有个all,和上面地址的例子可能是不一样。因为
这个all的js是比较全的兼容android和ios的啦。
上传图片<input type="file" capture="camera" accept="image/*" name="logo" />
capture(捕获的意思)表示调用相册相机camera,录音机video和摄像机audio
accept 表示,直接打开系统文件目录。(其实html5的input:file标签还支持一个multiple属性,表示可以支持多选。加上这个multiple后,capture就没啥用了,因为multiple是专门yong用来支持多选的。)
但是!!!!
input type="file" 添加了 accept="image/*"属性在Chrome和Safari等Webkit浏览器下却出现了响应滞慢的问题。使得页面弹出选择文件的弹窗非常的慢6-10s,这是因为accept="image/*"会每一个文件都遍历一次所有的”image/*”文件类型。
解决办法是:删掉它或者将 * 通配符,或者修改为指定的MIME类型:
<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg">
$(function(){$('input[name=logo]').on('change', function(){lrz(this.files[0], {width: 640}) //
width:640这个代表的是图片占得内存的大小。值越小,占内存越小
.then(function (rst) {//请求ajax把图片地址传过去$.ajax({url: site_url + 'api/user/updLogo',type: 'post',data: {img: rst.base64}, //rst.base64就是这个图片的地址 base64字符串
dataType: 'json',timeout: 200000,error: doAjax.error,success: doAjax.success,});
}).catch(function (err) {//捕获错误,而且一旦出错上面的then都不会执行}).always(function () {//无论成败都会执行这里});});
})
如果您的图片不是来自用户上传的,那么也可以直接传入图片路径:
lrz('./xxx/xx/x.png').then(function (rst) {// 处理成功会执行}).catch(function (err){// 处理失败会执行}).always(function () {// 不管是成功失败,都会执行});