文件上傳jsonajax
⑴ 如何用ajax上傳文件
引入ajaxfileupload.js
java">jQuery.extend({
createUploadIframe:function(id,uri)
{
//createframe
varframeId='jUploadFrame'+id;
if(window.ActiveXObject){
vario=document.createElement('<iframeid="'+frameId+'"name="'+frameId+'"/>');
if(typeofuri=='boolean'){
io.src='javascript:false';
}
elseif(typeofuri=='string'){
io.src=uri;
}
}
else{
vario=document.createElement('iframe');
io.id=frameId;
io.name=frameId;
}
io.style.position='absolute';
io.style.top='-1000px';
io.style.left='-1000px';
document.body.appendChild(io);
returnio
},
createUploadForm:function(id,fileElementId)
{
//createform
varformId='jUploadForm'+id;
varfileId='jUploadFile'+id;
varform=$('<formaction=""method="POST"name="'+formId+'"id="'+formId+'"enctype="multipart/form-data"></form>');
varoldElement=$('#'+fileElementId);
varnewElement=$(oldElement).clone();
$(oldElement).attr('id',fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
//setattributes
$(form).css('position','absolute');
$(form).css('top','-1200px');
$(form).css('left','-1200px');
$(form).appendTo('body');
returnform;
},
addOtherRequestsToForm:function(form,data)
{
//addextraparameter
varoriginalElement=$('<inputtype="hidden"name=""value="">');
for(varkeyindata){
name=key;
value=data[key];
varcloneElement=originalElement.clone();
cloneElement.attr({'name':name,'value':value});
$(cloneElement).appendTo(form);
}
returnform;
},
ajaxFileUpload:function(s){
//TODOintroceglobalsettings,,notonlytimeout
s=jQuery.extend({},jQuery.ajaxSettings,s);
varid=newDate().getTime()
varform=jQuery.createUploadForm(id,s.fileElementId);
if(s.data)form=jQuery.addOtherRequestsToForm(form,s.data);
vario=jQuery.createUploadIframe(id,s.secureuri);
varframeId='jUploadFrame'+id;
varformId='jUploadForm'+id;
//Watchforanewsetofrequests
if(s.global&&!jQuery.active++)
{
jQuery.event.trigger("ajaxStart");
}
varrequestDone=false;
//Createtherequestobject
varxml={}
if(s.global)
jQuery.event.trigger("ajaxSend",[xml,s]);
//Waitforaresponsetocomeback
varuploadCallback=function(isTimeout)
{
vario=document.getElementById(frameId);
try
{
if(io.contentWindow)
{
xml.responseText=io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
xml.responseXML=io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
}elseif(io.contentDocument)
{
xml.responseText=io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
xml.responseXML=io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
}
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(xml||isTimeout=="timeout")
{
requestDone=true;
varstatus;
try{
status=isTimeout!="timeout"?"success":"error";
//
if(status!="error")
{
//processthedata()
vardata=jQuery.uploadHttpData(xml,s.dataType);
//Ifalocalcallbackwasspecified,fireitandpassitthedata
if(s.success)
s.success(data,status);
//Firetheglobalcallback
if(s.global)
jQuery.event.trigger("ajaxSuccess",[xml,s]);
}else
jQuery.handleError(s,xml,status);
}catch(e)
{
status="error";
jQuery.handleError(s,xml,status,e);
}
//Therequestwascompleted
if(s.global)
jQuery.event.trigger("ajaxComplete",[xml,s]);
//HandletheglobalAJAXcounter
if(s.global&&!--jQuery.active)
jQuery.event.trigger("ajaxStop");
//Processresult
if(s.complete)
s.complete(xml,status);
jQuery(io).unbind()
setTimeout(function()
{ try
{
$(io).remove();
$(form).remove();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
},100)
xml=null
}
}
//Timeoutchecker
if(s.timeout>0)
{
setTimeout(function(){
//
if(!requestDone)uploadCallback("timeout");
},s.timeout);
}
try
{
//vario=$('#'+frameId);
varform=$('#'+formId);
$(form).attr('action',s.url);
$(form).attr('method','POST');
$(form).attr('target',frameId);
if(form.encoding)
{
form.encoding='multipart/form-data';
}
else
{
form.enctype='multipart/form-data';
}
$(form).submit();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(window.attachEvent){
document.getElementById(frameId).attachEvent('onload',uploadCallback);
}
else{
document.getElementById(frameId).addEventListener('load',uploadCallback,false);
}
return{abort:function(){}};
},
uploadHttpData:function(r,type){
vardata=!type;
data=type=="xml"||data?r.responseXML:r.responseText;
//Ifthetypeis"script",evalitinglobalcontext
if(type=="script")
jQuery.globalEval(data);
//GettheJavaScriptobject,ifJSONisused.
if(type=="json")
{
//,
//youhavetodeletethe'<pre></pre>'tag.
//ThepretaginChromehasattribute,sohavetouseregextoremove
vardata=r.responseText;
varrx=newRegExp("<pre.*?>(.*?)</pre>","i");
varam=rx.exec(data);
//thisisthedesireddataextracted
vardata=(am)?am[1]:"";//theonlysubmatchorempty
eval("data="+data);
}
//evaluatescriptswithinhtml
if(type=="html")
jQuery("<div>").html(data).evalScripts();
//alert($('param',data).each(function(){alert($(this).attr('value'));}));
returndata;
}
})
2.引入上傳文件所需的jar
7.獲取之後怎麼處理自己看著辦咯,我只能幫到這里了
⑵ js ajax怎麼傳送json數據
JSONArray json = JSONArray.fromObject(models); //list集合數據轉json
response.getWriter().println(json);//傳到前台
//ajax
success: function(data){
var models = eval("("+data+")");
var rows="";
for(var i in models){
rows =rows + "<tr>"+
"<td>"+models[i].statDate+"</td>"+
"<td>"+models[i].endDate+"</td>"+
"<td>"+models[i].name+"</td>"+
"</tr>" ;
}
$("#show_table").append(rows);//添加到table
PS:這是Servlet的寫法
⑶ 幾種常用的ajax配合json數據格式向後台發送
一、$.ajax()(無刷新)
jsonp格式:以url形式傳遞拼接數據:http://192.168.1.1/pwc/esb?gn=tx&cz=list&id=1&shzt=5
varparam={id:$("#cxsq_xk_id").val(),shzt:$('input[name="cxsq_sfcd"]:checked').val()}
$.ajax({
type:"POST",//請求方式post
dataType:'jsonp',//數據類型jsonp
jsonp:"jsoncallback",//回調類型jsonp
contentType:"application/x-www-form-urlencoded;charset=utf-8",//請求內容類型(鍵值對,編碼格式utf-8)
url:"/esb?gn=ts&cz=check",//請求地址
data:param,//請求附帶參數
timeout:20000,//請求超時時間(20秒)
error:function(XMLHttpRequest,textStatus,errorThrown){//請求錯誤捕捉
alert("連接伺服器失敗,請重試!");
},
success:function(responseData){//請求成功捕捉
$("#modal_cxsq").modal('hide');
InitData(cur_page);
$("#btn_modal_ts_tj").attr("disabled",false);
}
});
⑷ 如何使用ajax將json傳入後台數據
$.ajax({
type:"POST",
url:"login.action",
data:"userName=admin&password=admin",
success:function(msg){
alert("returnMsg:"+msg);
}
});
data哪裡就是在想後台傳送數據,如果數據是json格式的,那麼拼接一下就可以了,例如:
data:"userName="+json.name+"&password="+json.pwd;
⑸ 如何上傳json格式的數據到伺服器
首先,你可以手動拼json。然後是人ajax的方式,或者window.loacation=url的方式向服務端提交。
其次,但是不管你怎麼拼,都不能發送圖片等文件到伺服器!
這並不是說json格式不行,而是在頁面上發送信息到服務端的時候文件類的是由瀏覽器自動轉為流的,而你在頁面上的任何腳本都不能讀取文件!
⑹ 後端怎麼把json數據發送給ajax
用ajax訪問後台方法,這個後台方法把json數據返回就行了,ajax請求完畢會有個回調函數,回調函數的參數就是後台返回的json數據。如:
$.ajax("ur",function(data){//詳情的請求我就不寫了,只寫個回調函數
//這里是回調函數
varobj=data;//後台返回的json數據
});
你可以試一下,需要注意的是ajax訪問後台方法的地址不要錯了,有時候地址錯誤所以回調函數就沒有反應。
⑺ JSONPlaceholder本地創建的json文件,怎麼上傳到伺服器
json就是一個字元串。
把字元串發送到伺服器有很多種方式。
http 可以用ajax
tcp/udp 可以用socket
HttpServlet 就是http協議
<script src="${yourcontext}/javascripts/jquery-1.4.4.js" type="text/javascript"></script>
$.ajax({
type: 'POST',
url:'${model}${changeClass}',//你的url
data:json,//你的json數據
dataType:"json",
cache: false,
success: function(data){
alert(data);//發送json之後,伺服器的返回
}
});
⑻ Ajax調用restful介面傳送Json格式數據的方法
ajax傳送json格式數據,關鍵是指定contentType,data要是json格式
如果是restful介面,把type改成對應的post(增)、delete(刪)、put(改)、get(查)即可
var
post_data={"name":"test001","pass":"xxxx"};
$.ajax({
url:
"http://192.168.10.111:8080/uc/login",
type:
'post',
contentType:
"application/json;
charset=utf-8",
data:JSON.stringify(post_data),
success:function
(data)
{
//調用成功
},
error:
function(data,
textStatus,
errorThrown){
//調用失敗
}
});
以上所述是小編給大家介紹的Ajax調用restful介面傳送Json格式數據的方法的全部敘述,希望對大家有所幫助,如果大家想了解更多內容敬請關注腳本之家網站!