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

ufo1982ufo

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

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

复制代码

liangyongfei

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

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

ufo1982ufo

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

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

1. Model.prototype.model1Load = function(event) {
   
2.                 var data = this.comp("data1");
   
3.                 var uploader = this.comp("attachmentSimple1").uploader;
   
4.                 $(uploader.inputElement).attr('multiple', 'multiple');
   
5.                  var _URL = window.URL || window.webkitURL;
   
6.                 uploader.on('onFileSelected', function(event) {
   
7.                         var file = event.file, img;
   
8.                     if (file) {
   
9.                       img = new Image();
   
10.                       img.onload = function () {
    
11.                               alert(this.width);
    
12.                               alert(this.height);
    
13.                               alert(file.size);
    
14.                       };
    
15.                       img.src = _URL.createObjectURL(file);
    
16.                     }
    
17.                 });
    
18.         };

复制代码

ufo1982ufo

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

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

1.         Model.prototype.modelLoad = function(event){
   
2.                 this.initNotes();
   
3.                 this.loadAdData();
   
4.                 var self = this;
   
5.                 var data=this.comp("adData");               
   
6.                 var uploader = this.comp("attachmentSimple1").uploader;
   
7.                 $(uploader.inputElement).attr('multiple', 'multiple');
   
8.         var _URL = window.URL || window.webkitURL;
   
9.                 uploader.on('onFileSelected',function(event){
   
10.                         var uploader = self.comp("attachmentSimple1").uploader;
    
11.                         uploader.compress = false ;
    
12.                         debugger;
    
13.                         var uploader = self.comp("attachmentSimple1").uploader;
    
14.                         uploader.compress = false ;
    
15.                         if(event.file.type.indexOf("image/")<0){
    
16.                                 justep.Util.hint("只能上传图片:jpg、png、gif");
    
17.                                 event.cancel = true;
    
18.                         } else if($.parseJSON(data.getValue("asjson")).length>=1){
    
19.                                 justep.Util.hint("只能上传1个文件");
    
20.                                 event.cancel = true;
    
21.                         } else if(event.file.size>256*1024){
    
22.                                 if (confirm("图片大小超过256KB！！“确认”压缩上传，“取消”重新选择。")) {
    
23.                                         uploader.compress= true ;
    
24.                                         return;
    
25.                                 } else {
    
26.                                         event.cancel = true;
    
27.                                 }
    
28.                         }
    
29.                         var me = this;
    
30.                         var file = event.file, img;
    
31.             if (file) {
    
32.                     img = new Image();
    
33.                     img.onload = function () {
    
34.                             debugger;
    
35.                                         var width = this.width;
    
36.                                         var height = this.height;
    
37.                                         if( (width == 640 && height == 240 )|| ( width == 735 && height == 350)){
    
38.                                   alert(this.width);
    
39.                                   alert(this.height);
    
40.                         } else {
    
41.                                                 me.cancel = true;
    
42.                                                 event.cancel = true;
    
43.                                                 return;
    
44.                         }
    
45.                     };
    
46.                     img.src = _URL.createObjectURL(file);
    
47.             }
    
48.                 });
    
49.         };
    

复制代码

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

liangyongfei

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

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

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

1.         Model.prototype.modelLoad = function(event){
   
2.                 this.initNotes();
   
3.                 this.loadAdData();
   
4.                 var self = this;
   
5.                 var data=this.comp("adData");               
   
6.                 var uploader = this.comp("attachmentSimple1").uploader;
   
7.                 $(uploader.inputElement).attr('multiple', 'multiple');
   
8.         var _URL = window.URL || window.webkitURL;
   
9.                 uploader.on('onFileSelected',function(event){
   
10.                         var uploader = self.comp("attachmentSimple1").uploader;
    
11.                         uploader.autoUpload = false ;
    
12.                         uploader.compress = false ;
    
13.                         var file = event.file, img;
    
14.                         if (file) {
    
15.                     img = new Image();
    
16.                     img.onload = function () {
    
17.                                         var width = this.width;
    
18.                                         var height = this.height;
    
19.                                         if(!((width == 640 && height == 240) || ( width == 735 && height == 350))){
    
20.                                                 justep.Util.hint('主图片不符合要求，请修改后重新上传');
    
21.                         } else {
    
22.                                 self.comp('attachmentSimple1').uploader.submit();
    
23.                         }
    
24.                     };
    
25.                 }
    
26.                 img.src = _URL.createObjectURL(file);
    
27.                         if(event.file.type.indexOf("image/")<0){
    
28.                                 justep.Util.hint("只能上传图片:jpg、png、gif");
    
29.                                 event.cancel = true;
    
30.                         } else if($.parseJSON(data.getValue("asjson")).length>=1){
    
31.                                 justep.Util.hint("只能上传1个文件");
    
32.                                 event.cancel = true;
    
33.                         } else if(event.file.size>256*1024){
    
34.                                 if (confirm("图片大小超过256KB！！“确认”压缩上传，“取消”重新选择。")) {
    
35.                                         uploader.compress= true ;
    
36.                                         return;
    
37.                                 } else {
    
38.                                         event.cancel = true;
    
39.                                 }
    
40.             }
    
41.                 });
    
42.         };
    

复制代码

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