Home  >  Article  >  Backend Development  >  【手机上传】jQuery传递数据同时上传文件到php后台接受不到的问题

【手机上传】jQuery传递数据同时上传文件到php后台接受不到的问题

WBOY
WBOYOriginal
2016-06-02 11:28:431028browse

php手机jquery

各位前辈们好,这个问题困扰我挺长时间了,这是我之前的提问,我在网上下载的一份不完整源码:前端有一个上传框,上传图片后会自动生成预览图,可是后台php页面用post方法或者file方法都收不到上传的文件,text文本数据可以收到。有大神告诉我说用form.js插件,小弟不才怎么弄也不会,所以求大神告知详细一点的操作,在哪里添加什么才好?代码如下:前端
js源码

html代码

<code>   <meta charset="UTF-8">  <script type="text/javascript" src="mobile.js"></script>  <script type="text/javascript">  $(document).ready(function(){    $("#add-topic-form").submit(postTopic);    $("#picture").val("");  });  </script>        <form method="post" id="add-topic-form" enctype="multipart/form-data">          <div class="inner">            <div class="input-body">              <textarea maxlength="200" name="message" rows="7"></textarea>              <div class="input-file">                <div class="file-show"></div>                <input type="button" class="camera">                <input type="file" name="picture" id="picture" accept="image/gif, image/jpeg, image/png" onchange="uploadPreview(this.files)">                    </div>            </div>            <input class="submit-button" type="submit" value="发布">          </div>        </form>        </code>

js代码

<code> function uploadPreview(files){    if( !window.FileReader ){}   //此处为一些条件    $(".file-show").html("预览加载中...");    var reader = new FileReader();    reader.onload = function(e)    {        $(".file-show").html("");        $("<img  src="data:application/octet-stream;%22+e.target.result.substr(e.target.result.indexOf(%22base64,%22))+%22" id="previewImg" alt="【手机上传】jQuery传递数据同时上传文件到php后台接受不到的问题" >").appendTo($(".file-show")).click(function()        {            $(this).remove();            $("#picture").val("");        });    }    reader.readAsDataURL(files[0]);}function postTopic()            {    var msg = $.trim($('textarea[name=message]').val());    var picture = "";    picture = $("#previewImg").attr("src");    $(".loading").show();    $("#add-topic-form").hide();    $.post("addTopic.php",{"do":"addTopic","msg":msg,"picture":$("#picture").val()},function(data){} //在addTopic.php页面接收不到东西    {        if (data.result == "login")        {            location.href = "./passport.php";        }        else if (data.result == "success")        {            location.href = "./?cid=" + $('input[name=cid]').val();        }        else if (data.result == "error")        {            alert(data.message);            $(".loading").hide();            $("#add-topic-form").show();            $('html, body').animate({scrollTop: $(document).height()}, 300);        }    },"json");    return false;}</code>
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn