upload

js上传文件 例子见DEMO

用法

<button id="btn_upload">upload</button>
<script src="../src/jquery-1.9.1.min.js"></script>
<script src="../src/upload.js"></script>
<script>
var upload = new Upload();
upload.init({target:$('#btn_upload'),url:"data.html",accept:"png,jpg", callback:function(result){
    eval( 'result='+result);
    $('body').append('<img src="'+result.url+'" width="200" height="200"/><input type="hidden" value="'+result.url+'"/>');
}});
</script>

或者 requirejs:

<button id="btn_upload">upload</button>
<script type="text/javascript" src="../dest/require.js"></script>
<script>
requirejs.config({
    //By default load any module IDs from js/lib
    baseUrl: '../dest',
    paths: {
        $: 'jquery-1.11.2',
        upload:"upload"
    }
});
require(['upload',"$"], function(Upload,$) {
    var upload = new Upload();
    upload.init({target:$('#btn_upload'),url:"data.html",accept:"png,jpg", callback:function(result){
        eval( 'result='+result);
        $('body').append('<img src="'+result.url+'" width="200" height="200"/><input type="hidden" value="'+result.url+'"/>');
    }});
});
</script>

属性和方法

属性

target:

    上传的对象结点(jquery方式调用的为它本身)

url:

    上传提交地址

accept:

    文件格式,如"jpg,png,jpeg",不区分大小写

方法

callback:function(result)

    上传完成后的回调,参数result是返回的数据,这里只作字符串的处理,如果要转json可以使用JSON.parse或上面例子里的eval进行转换

startUpload:function(input,i)

上传开始时的回调,i 是一个随机的key,它与callback的i是一相同的,可以用它来串联这些回调,比如例子中的loading效果

其它组件推荐

源码在github上托管,请尽量到github上下载最新代码!也可以提交Issues. 如果您发现demo无法使用时,请多刷新几次,可能是js文件没有加载成功。