ThinkSNS使用上传图片widget的正确方式

前后台都可以通过Upload widget 来实现上传图片的功能。

<!--第一种方式-->
{:W('Upload',array('callback'=>'callbackTest','uploadType'=>'image','inputname'=>'cover','urlquery'=>'thumb=1'))}
<!--第二种方式-->
{:W('Upload',array('callback'=>'callbackTest','uploadType'=>'image','inputname'=>'cover'))}

再添加一个回调测试函数

function callbackTest(data){
    console.log(data);
}

第一种情况得到的data.src是http://m.cn/thinksns3/data/upload/2014/0703/15/53b50c5482a37.png

第二种情况得到的data.src是2014/0703/15/53b50c5482a37.png

为什么会这样呢？

查看\thinksns3\addons\theme\stv1\_static\js\plugins\core.uploadFile.js

发现最后上传请求的是这个地址U('widget/Upload/save')+'&'+_this.urlquery;

查看\thinksns3\addons\widget\UploadWidget\UploadWidget.class.php就明了了，原来根据得到的$_REQUEST['thumb']是否为1，来输出最后的src是否为全路径。这里就不贴代码了，有兴趣的自己去看吧。

顺便说下后台使用admin.upload()方法来上传图片的时候也需要带上urlquery="thumb=1"

<div>
    <input type="file" name="attach" rel="1" onchange="admin.upload('cover',this)" urlquery="thumb=1">
    <div id="show_cover"></div>
    <input name="cover" id="form_cover" type="hidden" value="" class="s-txt" style="width:200px;">
</div>

查看 \thinksns3\addons\theme\stv1\_static\admin\admin.js 的方法可知

admin.upload = function(type,obj){
    if("undefined"  != typeof(core.uploadFile)){
        core.uploadFile.filehash = new Array();
    }
	core.plugInit('uploadFile',obj,function(data){
        $('.input-content').remove();
        $('#show_'+type).html('<img class="pic-size" src="'+data.src+'">');
        $('#form_'+type).val(data.attach_id);    
    },'image');
};

实际调用的还是core.uploadFile

👇 下面是我的公众号，高质量的博文我会第一时间同步到公众号，给个关注吧！