快应用1000版本Web组件不支持输入类型为文件时的临时解决方法。

 2024-02-21 02:04:31  阅读 0

应用1000及之前版本的Web组件目前还不是元素,暂时无法在Web组件中直接上传文件。 据说1010版本会支持,但不知道能支持到什么程度。 可以支持照片上传吗? ? ?

我目前开发的项目原本在网页上有用户注册功能,在快应用上也放置了一个注册入口。 但是我无法通过注册时输入的方式上传身份证件和照片,所以我必须灵活地实现。

查看Web组件的相关帮助文档

发现有一个事件。 这和原来应用程序开发时控件的事件是一样的。 两者都可以实现Web组件主动通知框架程序的功能,这就是想法的由来。

假设你的h5页面上有一个控件可以选择图片文件并将图片上传到指定的URL进行接收。 URL(以下简称接收URL)上已指定接收后要存储的路径和存储文件名。 ),上传成功后即可预测上传文件的URL(以下简称文件URL)。

首先修改h5页面输入按钮的相关功能。 您可以根据来源决定是否使用该控件。 只需在使用快速应用程序打开页面时使用它即可。 然后,动态改变h5页面的标题,然后定期判断文件是否上传成功。

(){

//更改页面标题,通知快应用要上传图片

var tit = .title;

.title = "@@接收网址";

((){.title = tit;},1000); //设置完成后恢复标题,保证下次调用时可以更改标题

//启动定时器,定时判断图片是否已经上传到服务器。 最好指定最大测定次数。

变量=0;

var = ($(this).attr("intid"));

> 0 && ();

= ((){

var iUrl = 文件 URL;

//判断文件是否上传成功

$.ajax({

类型:'头',

网址:iUrl,

缓存:假,

异步:假,

:(数据,,xhr){

();

//文件已上传,进行后续操作

});

获取input的id_获取input的value_快应用获取input的值

++;

//测试30次后不再测试

如果(>30){

();

},2000);

$(this).attr("intid", );

复制代码

快速应用程序定义放置在界面上的 Web 组件中的事件。

复制代码

然后检测事件中是否有文件上传请求。 当有上传请求时,会弹出上传提示。 您可以选择拍摄照片并上传或从图库中选择。

从 '@。'

从 '@。'

从 '@。'

来自“@.media”的媒体

从工作'

(对象){

var that = this;

if(!obj.title){}

if(obj.title.('@') == 0){

var finfo = obj.title.(8, );

那。((m, tp){

如果(tp ==“无”){

(“当前网络不可用,无法上传文件!”)

;

var msg = (m ? '您当前使用 ' + tp.() + ' 方式上网,上传文件会消耗流量,确定继续吗?\r\n\r\n' : '') + '请选择继续。 文件上传方式';

var btnA = [{

text: '照片上传',

获取input的id_快应用获取input的值_获取input的value

颜色: '#'

},{

text: '从图库中选择',

颜色: '#'

}];

如果(米){

btnA.push({text: '取消',color: '#'})

.({

title: '文件上传',

: 消息,

:btnA,

:(资源){

if (res.index == 0) {

媒体。({

: (数据) {

那。(finfo,data.uri);

});

}否则如果(res.index == 1){

媒体。({

: (数据) {

那。(finfo,data.uri);

});

});

});

},

(卷起、卷起){

//furl为接收URL,furi为本地文件路径

快应用获取input的值_获取input的id_获取input的value

var that = this;

var fname = 解析furl 获取文件名

//开始上传文件...');

.({

网址: 卷曲,

文件:[

乌里:福里,

名称:'文件',

: 名称

],

: (数据) {

//上传成功

},

失败:(数据,代码){

//上传失败

});

},

(){

.({

: (数据) {

如果(){

(数据.,数据.类型);

})

复制代码

这种方式的缺点是h5页面必须定期判断文件是否上传,会消耗一定的流量。 同时,h5和快应用都需要修改和适配。

好处是可以选择上传图片,也可以拍照上传,还可以在上传前判断手机上的网络情况。 (快应用下一版本据说还支持选择非图片文件的界面)

即使下个版本支持h5页面中的输入上传功能,但不确定是否支持照片上传,因此上述解决方法在版本升级后可能仍然有用。

标签: 上传 应用 组件

如本站内容信息有侵犯到您的权益请联系我们删除,谢谢!!


Copyright © 2020 All Rights Reserved 京ICP5741267-1号 统计代码