jQuery文件上传插件

[b]插件介绍[/b]
html的file控件由一个text框和一个button构成。存在如下几个问题:
1、text框中无法初始化一些说明文字。
2、button上的字是浏览器内置的,修改不了,英文版的浏览器是“Browser…”,中文版的浏览器是“浏览…”,导致无法给按钮上的文字国际化。
3、button的样式也是浏览器内置的,控制不了。
要达到下图的效果,type=”file”不可能。
[img]http://dl.iteye.com/upload/attachment/0076/5272/b71022cf-8f2a-35bc-a066-59218f95a9f3.bmp[/img]
jquery.fakeUpload就是为了解决上述问题而编写的插件。

[b]如何使用[/b]
1、导入jquery.fakeUpload.js(当然它是依赖jquery的)
2、在html的body中加入span或div元素

<span id="span1" name="myfile"></span> //name为后台需要接受的文件参数

3、在jquery的ready方法中初始化fakeUpload组件,初始时参数都是非必须的。

$("#span1").fakeUpload("init",{
tiptext:"只可选*.jpg文件",
btntext:"选择文件...",
btnclass:"btn"
});

4、在页面中通过var path=$(“#span1”).fakeUpload(“getPath”);获取选择文件的全路径

[quote]关于后台如何处理?
1、可以将这个控件就当做浏览器的file控件来对待。
2、文件数据会根据name指定的名字(myfile)传到后台。Action中需要定义一个private File myFile并有相应的set方法。
3、数据需要通过form表单提交过去,form的method="post",enctype="multipart/form-data"。
[/quote]

[b]方法[/b]
[u]init[/u]
初始化控件,调用$(“XX”).fakeUpload(“init”,params);
[i]参数[/i]
Object,属性介绍如下。
•tiptext:String,可选,放在text框中的说明性文字,默认空串。
•width:Number,可选,text框的宽度,默认150。
•btnclass:String,可选,应用在按钮上的Class Name(s),默认“BUTTON75”。
•btntext:String,可选,按钮上的文字,默认“浏览…”。
•checkfn:Function,可选,选择文件后通过这个回调函数验证文件,文件全路径和file组件的name会作为函数参数传给回调函数,默认为

function(filePath,name){
return true;
}

[i]返回值[/i]
jQuery对象。

[u]getPath[/u]
获取选择的文件全路径,调用$(“XX”).fakeUpload(“getPath”);
[i]参数[/i]

[i]返回值[/i]
String,文件全路径。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值