| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 2121 人关注过本帖
标题:求助:php原生态ajax上传图片的问题
只看楼主 加入收藏
未知生物
Rank: 1
等 级:新手上路
帖 子:2
专家分:0
注 册:2017-1-23
收藏
 问题点数:0 回复次数:1 
求助:php原生态ajax上传图片的问题
<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>


程序代码:
<script>
document.getElementById('files').addEventListener('change', UpladFile, false);
    var image_data;
     
    function createRequest() {
         
  try {
    request = new XMLHttpRequest();
  } catch (tryMS) {
    try {
      request = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (otherMS) {
      try {
        request = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (failed) {
        request = null;
      }
    }
  }   
  return request;
}
     

 

 

 
function UpladFile(evt)
{
    if(!evt)
    {
        evt = window.event;
    }
    var files = evt.target.files;
    for(var i=0,f;f = files[i];i++){
        if(!f.type.match('image.*')){
            continue;
        }
     
     
    var reader = new FileReader();

 
     
     
       // Closure to capture the file information.
      reader.onload = (function(theFile) {
        return function(e) {
          // Render thumbnail.
           
          var span = document.createElement('span');
          span.innerHTML = ['<img class="thumb" src="', e.target.result,
                            '" title="', escape(theFile.name), '"/>'].join('');
          document.getElementById('list').insertBefore(span, null);
           
          image_data = 'image_code=' + e.target.result;
        };
      })(f);
       
       
          var FileController = 'upload.php';
        reader.readAsDataURL(f);
         
         xhr = createRequest();
         if (xhr == null) {
    alert("Unable to create request");
    return;
  }
        xhr.onreadystatechange = handleStateChange;
        xhr.open("POST", FileController, true);
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.send(image_data);
    }

 
}

 
     
     
    function handleStateChange()
    {
        if(xhr.readyState == 4)
        {
            if (xhr.status == 200)
            {
                alert(xhr.responseText);
            }
        }
    }
     
     
    </script>



程序代码:
     
<?php
    if(isset($_POST[image_code]))
    {
    echo "success";
    }
     
    ?>



第一张图片时:
图片附件: 游客没有浏览图片的权限,请 登录注册

再次选择文件上传:
图片附件: 游客没有浏览图片的权限,请 登录注册



为什么上传第一张图片的时候php没有读取到POST的数据,之后再次选择文件上传就可以了呢?
搜索更多相关主题的帖子: multiple request change files 原生态 
2017-01-23 20:39
未知生物
Rank: 1
等 级:新手上路
帖 子:2
专家分:0
注 册:2017-1-23
收藏
得分:0 
原来是因为读文件是异步的。。把send放到onload里就行了
2017-01-24 19:16
快速回复:求助:php原生态ajax上传图片的问题
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.015680 second(s), 9 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved