用attachmentsimple上传图片，如何判断图片的宽度和高度。

ufo1982ufo · 发表于 2017-3-29 22:51:24

在使用attachmentsimple的页面的modelLoad事件中如何判断？

var uploader = this.comp("attachmentSimple1").uploader;
uploader.on('onFileSelected',function(event){
.....
}

复制代码

liangyongfei · 发表于 2017-3-30 10:25:57

这个代码建议上网查一下吧！
http://www.jb51.net/article/89835.htm

结合http://docs.wex5.com/wex5-ui-question-list-2081 获取files 对象！！

ufo1982ufo · 发表于 2017-3-31 10:18:52

liangyongfei 发表于 2017-3-30 10:25
这个代码建议上网查一下吧！
http://www.jb51.net/article/89835.htm

我看了这个帖子：[url=如何获取attachmentsimple上传的图片的尺寸？？长度和宽度 http://bbs.wex5.com/forum.php?mod=viewthread&tid=99161 (出处: 起步软件技术论坛)]如何获取attachmentsimple上传的图片的尺寸？？长度和宽度 http://bbs.wex5.com/forum.php?mod=viewthread&tid=99161 (出处: 起步软件技术论坛)[/url]
获取到的也是undefined，也一直没有答复。

另外获取到的“files” 对象里面没有有关的宽度和高度的数据！

liangyongfei · 发表于 2017-3-31 10:50:26

ufo1982ufo 发表于 2017-3-31 10:18
我看了这个帖子：http://bbs.wex5.com/forum.php?mod=viewthread&tid=99161 (出处: 起步软件技术论坛)]如 ...

Model.prototype.model1Load = function(event) {
var data = this.comp("data1");
var uploader = this.comp("attachmentSimple1").uploader;
$(uploader.inputElement).attr('multiple', 'multiple');
var _URL = window.URL || window.webkitURL;
uploader.on('onFileSelected', function(event) {
var file = event.file, img;
if (file) {
img = new Image();
img.onload = function () {
alert(this.width);
alert(this.height);
alert(file.size);
};
img.src = _URL.createObjectURL(file);
}
});
};

复制代码

ufo1982ufo · 发表于 2017-3-31 17:09:01

liangyongfei 发表于 2017-3-31 10:50

按照如上的却可以获取到了高度和宽度，我希望不符合就取消上传，但是失败了！

Model.prototype.modelLoad = function(event){
this.initNotes();
this.loadAdData();
var self = this;
var data=this.comp("adData");
var uploader = this.comp("attachmentSimple1").uploader;
$(uploader.inputElement).attr('multiple', 'multiple');
var _URL = window.URL || window.webkitURL;
uploader.on('onFileSelected',function(event){
var uploader = self.comp("attachmentSimple1").uploader;
uploader.compress = false ;
debugger;
var uploader = self.comp("attachmentSimple1").uploader;
uploader.compress = false ;
if(event.file.type.indexOf("image/")<0){
justep.Util.hint("只能上传图片:jpg、png、gif");
event.cancel = true;
} else if($.parseJSON(data.getValue("asjson")).length>=1){
justep.Util.hint("只能上传1个文件");
event.cancel = true;
} else if(event.file.size>256*1024){
if (confirm("图片大小超过256KB！！“确认”压缩上传，“取消”重新选择。")) {
uploader.compress= true ;
return;
} else {
event.cancel = true;
}
}
var me = this;
var file = event.file, img;
if (file) {
img = new Image();
img.onload = function () {
debugger;
var width = this.width;
var height = this.height;
if( (width == 640 && height == 240 )|| ( width == 735 && height == 350)){
alert(this.width);
alert(this.height);
} else {
me.cancel = true;
event.cancel = true;
return;
}
};
img.src = _URL.createObjectURL(file);
}
});
};

复制代码

如果符合尺寸要求就alert，不符合就终止，结果用“event.cancel = true;”还是上传了！，用me替代this都不对，要怎么改？

liangyongfei · 发表于 2017-3-31 17:39:20

ufo1982ufo 发表于 2017-3-31 17:09
按照如上的却可以获取到了高度和宽度，我希望不符合就取消上传，但是失败了！

如果符合尺寸要求就alert ...

退出执行
event.cancel = true;
return;

就可以的啊！

但是需要在onFileSelected 事件中执行！！

在img.onload 事件中当然是不起作用的!!!

最起码试试定义个变量！！在img.onload 中赋值！
然后在 img.src = _URL.createObjectURL(file); 这行代码后面进行判断！值是多少，从而决定是否执行
event.cancel = true;
return;

（但是要求）img.onload 是同步的！异步就不行了！！而我试过了，果然是异步执行的！、。。。

所以你只能设置attachmentSimple 不自动提交！！满足条件的时候再手动提交
http://docs.wex5.com/wex5-ui-question-list-2105

ufo1982ufo · 发表于 2017-4-1 10:31:59

liangyongfei 发表于 2017-3-31 17:39
退出执行
event.cancel = true;
return;

是的，的却也是异步执行。
设置autoUpload为false，之前判断条件改为“非”，这样所有同步条件完了再执行异步的，符合再submit。

Model.prototype.modelLoad = function(event){
this.initNotes();
this.loadAdData();
var self = this;
var data=this.comp("adData");
var uploader = this.comp("attachmentSimple1").uploader;
$(uploader.inputElement).attr('multiple', 'multiple');
var _URL = window.URL || window.webkitURL;
uploader.on('onFileSelected',function(event){
var uploader = self.comp("attachmentSimple1").uploader;
uploader.autoUpload = false ;
uploader.compress = false ;
var file = event.file, img;
if (file) {
img = new Image();
img.onload = function () {
var width = this.width;
var height = this.height;
if(!((width == 640 && height == 240) || ( width == 735 && height == 350))){
justep.Util.hint('主图片不符合要求，请修改后重新上传');
} else {
self.comp('attachmentSimple1').uploader.submit();
}
};
}
img.src = _URL.createObjectURL(file);
if(event.file.type.indexOf("image/")<0){
justep.Util.hint("只能上传图片:jpg、png、gif");
event.cancel = true;
} else if($.parseJSON(data.getValue("asjson")).length>=1){
justep.Util.hint("只能上传1个文件");
event.cancel = true;
} else if(event.file.size>256*1024){
if (confirm("图片大小超过256KB！！“确认”压缩上传，“取消”重新选择。")) {
uploader.compress= true ;
return;
} else {
event.cancel = true;
}
}
});
};

复制代码

代码如上，已经解决，谢谢梁老师，请结贴！

		自动登录	找回密码
密码			注册

[结贴] 用attachmentsimple上传图片，如何判断图片的宽度和高度。