<!doctype html>
|
<html>
|
<head>
|
<meta charset="utf-8"/>
|
<title>渲染默认队列数据的demo</title>
|
<script src="http://a.tbcdn.cn/s/kissy/1.2.0/kissy-min.js" charset="utf-8"></script>
|
|
</head>
|
<body>
|
<h2>渲染默认队列数据的demo</h2>
|
|
<div class="grid">
|
<input type="image-uploader" class="g-u" id="J_DefaultShowBtn" value="上传图片" >
|
<input name="urls" type="hidden" value="http://tp4.sinaimg.cn/1653905027/180/5601547226/1,http://img02.taobaocdn.com/imgextra/i2/748902859/T2OTOdXm0bXXXXXXXX_!!748902859.jpg_310x310.jpg">
|
|
<!--以下内容不是必须的，假设需要给默认渲染的file添加额外数据-->
|
<script type="text/uploader-restore" id="J_ExtraData">
|
[{"author":"明河"},{"author":"剑平"}]
|
</script>
|
</div>
|
<ul id="J_DefaultShowQueue" class="grid">
|
|
</ul>
|
<script>
|
var S = KISSY,
|
//包路径，实际使用请直接配置为"http://a.tbcdn.cn/s/kissy/"
|
path = S.Config.debug && "../../../../../../" || "http://a.tbcdn.cn/s/kissy/";
|
S.config({
|
packages:[
|
{
|
name:"gallery",
|
path:path,
|
charset:"utf-8"
|
}
|
]
|
});
|
|
KISSY.use('gallery/form/1.3/uploader/imageUploader', function (S, ImageUploader) {
|
|
var imageUploader = new ImageUploader('#J_DefaultShowBtn','#J_DefaultShowQueue',{
|
// 文件域
|
name:"Filedata",
|
//处理上传的服务器端脚本路径
|
action:"upload.php",
|
//用于放服务器端返回的url的隐藏域
|
urlsInputName:"urls",
|
//最多上传个数
|
max:3,
|
//图片最大允许大小
|
maxSize:500
|
});
|
//添加完默认数据后，额外添加一些数据
|
|
var $ = S.Node.all;
|
var defaultExtraData = S.JSON.parse($('#J_ExtraData').text());
|
|
imageUploader.on('add',function(ev){
|
var queue = ev.queue;
|
var index = ev.index;
|
var file = ev.file;
|
var type = file.type;
|
//非restore方法默认渲染的数据
|
if(type != 'restore') return false;
|
if(!defaultExtraData[index]) return false;
|
queue.updateFile(index,defaultExtraData[index]);
|
S.log('额外数据：'+queue.getFile(index).author);
|
});
|
|
imageUploader.render();
|
})
|
|
</script>
|
</body>
|
</html>
|
