当前位置: 首页 > Web前端 > HTML

SAPUI5FileUploader的隐藏iframe设计细节

时间:2023-04-03 00:35:17 HTML

其实现代码位置如下:所有FileUploader的文本都相同,仅获取一次FileUploader.prototype._sBrowseText=rb.getText("FILEUPLOAD_BROWSE");返回FileUploader.prototype._sBrowseText?FileUploader.prototype._sBrowseText:"浏览...";};从上图可以看出,SAPUI5框架是从一个库文件中,根据keyFILEUPLOAD_BROWSE读取其对应的值,得到的结果是字符串Browse....上图1854行的三元表达式表示如果根据keyFILEUPLOAD_BROWSE读取库文件失败的逻辑,硬编码的默认值Browse...SAPUI5到的整个sap.ui.unifiedFileUploader控件所属库的资源文件位置:https://sapui5.hana.ondemand....SAPUI5全球化、多语言和翻译支持请参考Jerry的教程:SAPUI5应用开发教程8-多语言支持中FileUploader的onAfterRendering钩子,执行prepareFileUploadAndIFrame:首先准备文件上传:不要把this.oFileUpload和前面的this.oFilePath搞混了。这个aFileUpload是存储最终呈现的本机HTML源代码的地方。最后生成源码:''this.oFileUpload=jQuery(aFileUpload.join("")).prependTo(this.$().find(".sapUiFupInputMask")).get(0);上面代码通过jQuery代码找到css类:sapUiFupInputMask,在elements面板中的位置如下:最后this.oFileUpload通过css选择器指向jQuery返回的dom实例:即输入域:创建一个隐藏的iframe并插入到静态区:为这个隐藏的iframe注册加载事件:点击Browse...按钮后,会弹出选择本地文件的对话框:然后触发handlechange,使用varuploadForm=this.getDomRef("fu_form");获取表单实例:通过事件对象的target.files字段,获取用户选择的本地文件,并抛出change事件: