cajax上传图片
你好，据我所知，Ajax不能上传图片，因为上传图片得把图片的二进制数据传送给WEB服务器。而Ajax不能完成。
如果楼主指点是无刷新上传图片。即不更改当前页面上传图片，利用STRUTS并在HTML页面中加一个iframe标签，CSS DISPLAY属性为NONE 而上传图片的表单的TARGET属性等于这个iframe的名字。
‘贰’ jqueryajax不能上传图片
不能上传的原因可能是jquery插件使用不正确。
解决方法：
1、在head之间加入jquery引用
<scripttype="text/javascript" src="jquery.js"></script>
<scriptsrc="project/js/jquery.form.js" type="text/javascript"></script>
<scriptsrc="project/js/fileload.js" type="text/javascript"></script>
2、定义fileload.js，代码如下：
function createHtml(obj) {
var htmstr = [];
htmstr.push( "<form id='_fileForm' enctype='multipart/form-data'>");
htmstr.push( "<table cellspacing="0" cellpadding="3" style="margin:0 auto; margin-top:20px;">");
htmstr.push( "<tr>");
htmstr.push( "<td class="tdt tdl">请选择文件：</td>");
htmstr.push( "<td class="tdt tdl"><input id="loadcontrol" type="file" name="filepath" id="filepath" /></td>");
htmstr.push( "<td class="tdt tdl tdr"><input type="button" onclick="fileloadon()" value="上传"/></td>");
htmstr.push( "</tr>");
htmstr.push( "<tr> <td class="tdt tdl tdr" colspan='3'style='text-align:center;'><div id="msg"> </div></td> </tr>");
htmstr.push( "<tr> <td class="tdt tdl tdr" style=" vertical-align:middle;">图片预览：</td> <td class="tdt tdl tdr" colspan="2"><div style="text-align:center;"><img src="project/Images/NoPhoto.jpg"/></div></td> </tr>");
htmstr.push( "</table>")
htmstr.push( "</form>");
obj.html(htmstr.join(""));
}
function fileloadon() {
$("#msg").html("");
$("img").attr({ "src": "project/Images/processing.gif" });
$("#_fileForm").submit(function () {
$("#_fileForm").ajaxSubmit({
type: "post",
url: "project/help.aspx",
success: function (data1) {
var remsg = data1.split("|");
var name = remsg[1].split("/");
if (remsg[0] == "1") {
var type = name[4].substring(name[4].indexOf("."), name[4].length);
$("#msg").html("文件名：" + name[name.length - 1] + " --- " + remsg[2]);
switch (type) {
case ".jpg":
case ".jpeg":
case ".gif":
case ".bmp":
case ".png":
$("img").attr({ "src": remsg[1] });
break;
default:
$("img").attr({ "src": "project/Images/msg_ok.png" });
break;
}
} else {
$("#msg").html("文件上传失败：" + remsg[2]);
$("img").attr({ "src": "project/Images/msg_error.png" });
}
},
error: function (msg) {
alert("文件上传失败");
}
});
return false;
});
$("#_fileForm").submit();
}
3、服务端处理上传。
protected void Page_Load(object sender, EventArgs e)
{
try
{
HttpPostedFile postFile = Request.Files[0];
//开始上传
string _savedFileResult = UpLoadFile(postFile);
Response.Write(_savedFileResult);
}
catch(Exception ex)
{
Response.Write("0|error|上传提交出错");
}
}
public string UpLoadFile(HttpPostedFile str)
{
return UpLoadFile(str, "/UpLoadFile/");
}
public string UpLoadFile(HttpPostedFile httpFile, string toFilePath)
{
try
{
//获取要保存的文件信息
string filerealname = httpFile.FileName;
//获得文件扩展名
string fileNameExt = System.IO.Path.GetExtension(filerealname);
if (CheckFileExt(fileNameExt))
{
//检查保存的路径 是否有/结尾
if (toFilePath.EndsWith("/") == false) toFilePath = toFilePath + "/";
//按日期归类保存
string datePath = DateTime.Now.ToString("yyyyMM") + "/" + DateTime.Now.ToString("dd") + "/";
if (true)
{
toFilePath += datePath;
}
//物理完整路径
string toFileFullPath = System.Web.HttpContext.Current.Request.PhysicalApplicationPath + toFilePath;
//检查是否有该路径 没有就创建
if (!System.IO.Directory.Exists(toFileFullPath))
{
Directory.CreateDirectory(toFileFullPath);
}
//得到服务器文件保存路径
string toFile = Server.MapPath("~" + toFilePath);
string f_file = getName(filerealname);
//将文件保存至服务器
httpFile.SaveAs(toFile + f_file);
return "1|" + toFilePath + f_file + "|" + "文件上传成功";
}
else
{
return "0|errorfile|" + "文件不合法";
}
}
catch (Exception e)
{
return "0|errorfile|" + "文件上传失败,错误原因：" + e.Message;
}
}
/// <summary>
/// 获取文件名
/// </summary>
/// <param name="fileNamePath"></param>
/// <returns></returns>
private string getName(string fileNamePath)
{
string[] name = fileNamePath.Split('\');
return name[name.Length - 1];
}
/// <summary>
/// 检查是否为合法的上传文件
/// </summary>
/// <param name="_fileExt"></param>
/// <returns></returns>
private bool CheckFileExt(string _fileExt)
{
string[] allowExt = new string[] { ".gif", ".jpg", ".jpeg", ".rar",".png" };
for (int i = 0; i < allowExt.Length; i++)
{
if (allowExt[i] == _fileExt) { return true; }
}
return false;
}
public static string GetFileName()
{
Random rd = new Random();
StringBuilder serial = new StringBuilder();
serial.Append(DateTime.Now.ToString("HHmmss"));
serial.Append(rd.Next(100, 999).ToString());
return serial.ToString();
}
4、运行defualt.aspx页面以后显示的效果是：
‘叁’ jquery ajax上传图片问题
现在基本上没有真正的AJAX图片上传，你想多了
都是伪AJAX上传
但是如果是HTML5，倒是有可能，使html5的 canvas，可以把图片序例化成base64字符串，把这个字符串传到服务器，处理一下，再保存就OK了，
我想知道你直接ajax怎么传，把你本地路径传过去吗~~~~~
肯定是不行的
‘肆’ ajax上传图片，C#编写的webserbice接收，无法上传
不是这样上传的，你就传个图片路径服务器怎么能获取到客户端的文件？
如果需要ajax异步上传图片，有两种解决方案，
一、采用HTML5的FileReader的readAsDataURL获取图片的base64编码，获取出来是一个字符串，把这个字符串上传到服务器，服务器接收到采用Convert.FromBase64String获取图片byte数组，再转换成图片格式保存。
二、使用隐藏form表单和隐藏iframe，将form的target属性设置为iframe的name，在from表单里放一个file控件，用它选择图片，然后提交form表单，后台接收到图片保存，返回一段js代码，类似window.parent.uploadCallback({"state":1,"url":"你保存图片的路径"});，然后在页面写一个function uploadCallback(result){//处理回调}
不知道有没有更好的解决办法，我用过的就这两种，感觉都挺好用。
‘伍’ ajax能上传图片吗
有一个ajaxfileupload的组件 ajaxfileupload.js，可以异步上传文件。
‘陆’ ajax怎么上传图片
这个一般要使用插件,手动不好搞,你去网络webuploader吧,网络出的上传插件api全面,也比较好用
‘柒’ CI如何ajax方式上传图片
方法如下：
1、新建一个CI框架项目ajax，在controllers文件夹下新建控制器img，在img控制器下新建方法index，如下:
注意事项：
使用ajax，要引入js文件，比如jquery-1.7.2.min.js，否则ajax不执行。
‘捌’ springmvc+ajax上传图片的问题。传过去的是空值.怎么接收图片
因为SpringMVC只有GET请求才能通过方法上加参数获取到值，POST是不能通过这种方式获取的，可以通过request.getParameter(key) 或者 封装成对象（属性对应前端参数）会自动填充。
另外我记得Ajax上传文件不能直接用$.ajax这种方式传，我的方法如下：
var form = new FormData();
var xhr = new XMLHttpRequest();
xhr.open("post", "url", true);
xhr.onload = function () {
alert("上传完成!");
};
xhr.send(form);
‘玖’ php ajax如何上传图片
如果为了追求方便，直接使用jquery+uploadify ,这个组合封装了许多上传功能，可以实现无缝上传。比如可以用户选择图片直接自动上传，然后显示出来（当然这个脚本是要自己写的）,还有flash动画，按钮、进度条比较炫。而且有php后台脚本，甚至不用做修改。但是缺点是不支持iphone ipad。对ie 搜狗 和国内比较渣水的浏览器支持不好。
其次可以使用jquery+jqform，脚本简单，但是没有flash特效，样式比较单一，不过其他功能比较全。
最后就是用原生，反正我是写不出来……