< 返回首页

标哥的笔记,是记录在日常学习技术和日常开发中那些年遇到过的坑!本站为新站,原"标哥的技术博客"中的文章会慢慢移到本站,欢迎收藏本站!
在使用本站过程中,有任何建议请联系标哥! 另,承接App开发、网站开发和微信小程序开发!欢迎联系我们


ThinkPHP5+ajaxfileupload无刷新上传

 作者:标哥    发布日期:2017-03-01 19:50    阅读量:1723次
 

ThinkPHP+jQuery的AjaxFileUpload实现无实现新上传文件,但是最新版本的有一个bug,调试了下才发现问题所在!问题是这样的,上传后返回来JSON字符串,但是这个插件并不能正确解析出来!

要求

jQuery 1.6.1+

浏览器支持

The following browsers are supported:

Google Chrome 5.0+
Internet Explorer 6+
Mozilla Firefox 3.6+
Opera 10.5+
Safari 5+ 

All recent versions of these browsers should be supported. If not I’d like to hear about it. Versions prior to those listed here may work but are untested.

问题代码

function onComplete (e) {
    var $iframe  = $(e.target),
        doc      = ($iframe[0].contentWindow || $iframe[0].contentDocument).document,
        response = doc.body.innerHTML;

    if (response) {
        response = $.parseJSON(response);
    } else {
        response = {};
    }

    settings.onComplete.call(e.data.element, e.data.filename, response);
    
    // Remove the temporary form and iframe
    e.data.form.remove();
    $iframe.remove();
}

我在服务器端直接返回一个JSON串,如下:

public function import($type=0) {
    return json(['code'=>0, 'msg'=>'测试']);
}

但是,这个插件返回来的结果并不能得到正确的解析出JSON,导致报错了。

解决办法

将上面所贴的代码中的doc.body.innerHTML,替换成doc.body.innerText,因为它的代码下一行是要解析JSON,所以应该提到的是文本而非HTML标签!

插件地址

下载地址:https://github.com/davgothic/AjaxFileUpload

                   

承接:ThinkPHP项目开发、网站项目开发、微信项目开发、微信小程序项目开发、App开发,欢迎联系标哥QQ632840804