图片上传的jquery,图片上传的时间 使用者能忍受的最长等待时间

用js、jquery如何实现上传图片的预览

$("#btnLoadPhoto").upload({ url: "../UploadForms/RequestUpload.aspx?action=photo", type: "json", callback: calla });

//获得表单元素

 HttpPostedFile oFile = context.Request.Files[0];

 //设置上传路径

 string strUploadPath = "temp/";

 //获取文件名称

 string fileName = context.Request.Files[0].FileName;

补充：JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库 ，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需要定义id即可。

相关问答

Q1: 怎么在jquery中上传图片？

不懂你是什么意思，能说请楚点吗。jquery上传图片你可以试下 Jquery插件AjaxUpload

Q2: jquery如何将页面生成的图片上传到服务器

File Upload组件啊，是同步还是异步呢

html部分：

input type="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="image/*"

文件引入：

link rel="stylesheet" type="text/css" href="diyUpload/css/diyUpload.css"script type="text/javascript" src="diyUpload/js/diyUpload.js"/script

HTML部分：

div id="demo" div id="as" /div/div

JS部分：

script type="text/javascript"

/** 服务器地址,成功返回,失败返回参数格式依照jquery.ajax习惯;* 其他参数同WebUploader*/

$('#as').diyUpload({

url:'server/fileupload.php',

success:function( data ) {

console.info( data ); },

error:function( err ) {

console.info( err );

},

buttonText : '选择文件', chunked:true, // 分片大小

chunkSize:512 * 1024, //最大上传的文件数量, 总文件大小,单个文件大小(单位字节);

fileNumLimit:50,

fileSizeLimit:500000 * 1024,

fileSingleSizeLimit:50000 * 1024,

accept: {}});

/script

Q3: js/jquery上传图片的问题

function showImage(fileid,imgid,atagID){

var ext = "_0";

var thumb = $('img#'+imgid);

var litbox = $('a#'+atagID);

var img1path = document.getElementById("img1path");;

if($('.onTeedaError').length0){

//img1path.value="";

}

var messages =document.getElementById("messages");

if(messages!=null){

//img1path.value="";

}

new AjaxUpload(fileid, {

action: '../../PdfChangeImgUploadServlet?pdfNameEnd=_PERT',

name: ext,

onSubmit: function(file, extension) {

extension=extension.toLowerCase();

if(extension=="pdf")

{

$("#photoError").hide();

$.blockUI({

message: $('span#displayBox'),

css: {

border: 'none',

width: '270px',

}

});

}else{

$("#photoError").show();

return false;

}

},

onComplete: function(file, response) {

$('.pdfImg').remove();

$('#pfont').hide();

$.unblockUI();

var res = eval('('+response+');');

var timestemp = new Date().getTime();

var srcStr = res['srcStr'];

$('#addImg').val(res['srcStr']);

var imgWidth = res['w'] + "px";

var imgHeight = res['h'] + "px";

$("#addImgWidth").val(imgWidth);

$("#addImgHeight").val(imgHeight);

var str = "";

var arr = [];

arr = srcStr.split(",");

$('#imgFile').attr("value",srcStr);

for(var i=0;iarr.length;i++){

var jpgsrc = arr[i] + '?'+ timestemp;

if(i == 0){

str=str+"a class=\"pdfImg\" style=\"margin-left:10px;\" href="+jpgsrc+" rel=\"lightbox"+timestemp+"\"";

str=str+"img class=\"jpgImgFont\" src="+jpgsrc+" style=\"vertical-align:middle;cursor:pointer;width:"+ imgWidth +";height:"+ imgHeight +" \" /";

str=str+"/a";

} else {

str=str+"a class=\"pdfImg\" style=\"margin-left:10px;display:none;\" href="+jpgsrc+" rel=\"lightbox"+timestemp+"\"";

str=str+"img class=\"jpgImgFont\" src="+jpgsrc+" style=\"vertical-align:middle;cursor:pointer;width:"+ imgWidth +";height:"+ imgHeight +" \" /";

str=str+"/a";

}

}

$('#imgFontDiv').append(str);

//thumb.attr('src', res['src']+'?'+timestemp);

//litbox.attr('href', res['src']+'?'+timestemp);

lightbox.refresh();

$('.jpgImgFont').attr('style', 'width: ' + imgWidth + '; height: ' + imgHeight + ";" ).hide().fadeIn('slow');

if(res['img1path']!=""){

img1path.value=res['img1path'];

}

if (imgid == 'imgFont') {

document.getElementById("photoName").value=res['srcStr'].substring(res['srcStr'].lastIndexOf("/")+1);

}

//}

}

});

}

function goClearPhoto(textID,imgID,hrefID,photoName){

var _file = document.getElementById(textID);

if(_file.files)

{

_file.value = "";

}

else

{

if (typeof _file != "object")

{

return null;

}

var textID=document.getElementById(textID);

textID.value="";

var timestemp = new Date().getTime();

var src=document.getElementById("carPermitDefaultPath").value;

var thumb = $('img#'+imgID);

var litbox = $('a#'+hrefID);

thumb.attr('src',"/groupware/images/PdfSample.png");

thumb.attr('style', 'width:230px;height:240px;border:0px;vertical-align:middle;cursor:pointer;' ).hide().fadeIn('slow');

litbox.attr('href',"/groupware/images/PdfSample.png"+'?'+timestemp);

$('.pdfImg').remove();

litbox.show();

lightbox.refresh();

var photoName=document.getElementById(photoName);

photoName.value=null;

var imgFont= document.getElementById(imgFont);

imgFont.value = null;

}

$("#imgFile").val("");

$("#img1path").val("");

}

html:

body onload="showImage('insUpdPermitPhoto','imgFont','pfont');

div style="margin-top:3px;margin-bottom:-8px"

span class="sl-custom-file" style=""

input type="text" id="img1path" placeholder="対応フォーマット：pdfのみ" readonly="true" class="input-height" style="width:260px;height:20px;"/

button class="btn btn-small" id="reference" type="button" style="margin-left:-2px;margin-top:-12px"

span style="color:black;"参照/span

/button

input type="file" id='insUpdPermitPhoto' class="fileTransIE10 ui-input-file" name="ufile" onChange="getValue(this,'img1path')" /

/span

a href="javascript:void(0)" onfocus="this.blur();" onClick="goClearPhoto('img1path','imgFont','pfont','photoName');" class="btn btn-small" style="margin-top:-15px;"

span style="color:black;"削除/span

/a

/div

后台用copy方法把图片复制到指定路径就可以了