ExtJS前台多文件上传无控件

最新推荐文章于 2021-08-05 14:02:54 发布

原创最新推荐文章于 2021-08-05 14:02:54 发布 · 274 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

多文件上传

本文介绍了一个使用ExtJS框架实现的多文件上传组件，该组件允许用户选择多个指定类型的文件进行上传，如Flash、MP3、图片和FLV等。组件在IE8及以上版本和其他主流浏览器中表现良好，但在IE8以下版本中可能存在兼容性问题。文章还提到了通过修改文件域的属性来支持多文件选择，并监听文件变化以更新显示。

xtype: 'filefield',
                id: 'multipartFiles',
                name: 'multipartFiles',
                fieldLabel: '附件',
                buttonText: '请选择',
                inputWidth: 300,
                allowBlank: false,
                multipleFn: function ($this) {   //多文件上传
                    var typeArray = ["application/x-shockwave-flash", "audio/MP3", "image/*", "flv-application/octet-stream"];
                    var fileDom = $this.getEl().down('input[type=file]');
                    fileDom.dom.setAttribute("multiple", "multiple");
                    fileDom.dom.setAttribute("accept", typeArray.join(","));
                },
                listeners: {
                    afterrender: function () {
                        this.multipleFn(this);
                    },
                    change: function () {
                        var fileDom = this.getEl().down('input[type=file]');
                        var files = fileDom.dom.files;
                        var str = '';
                        for (var i = 0; i < files.length; i++) {
                            str += files[i].name;
                            str += ' ';
                        }
                        Ext.getCmp('multipartFiles').setRawValue(str);

                        this.multipleFn(this);
                    }
                }