前後端資料互動之前端傳值到後臺
阿新 • • 發佈:2019-01-26
在實際的專案開發中,經常要求前後端傳值。今天,主要介紹前端向後臺傳值的幾種方法。
第一種:ajax
傳給後臺的資料通過json封裝起來,再用ajax將json傳到後臺,需要新增jquery庫
window.onload = function(){ //生成json var json = []; //實際情況中,json物件的值可通過document.getElementByName()來獲取使用者輸入 for (var i = 1; i < 5; i++){ var j = {}; j.name = "name"; j.cars = "22"; j.obj = i; json.push(j); } var a = JSON.stringify(json); alert(a);//json //傳遞到後臺 $.ajax({ type:'POST', data:a,//json contentType = 'application/json', dataType:'json', url:'user/saveJsonUser.do', success:function(data){ alert("傳送成功"); }, error:function(e){ alert("傳送失敗"); } }); }
2、通過form表單的action傳值
一般情況下數值在傳給後臺之前需要校驗,可以在form中的onsubmit呼叫js方法進行校驗,當js方法返回值為true時,觸發action,當js方法返回值為false時,action不觸發。這樣處理的好處在於當用戶輸入不正確時,不會重新整理頁面,表單仍然會保留使用者之前的輸入
3、通過dom獲取標籤,觸發標籤的submit方法,直接提交資料到後臺
function query(){ var inputs = document.getElementsByName("sex"); for(var i = 0; i < inputs.length; i++){ if(inputs[i].checked){ //判斷是否選中 var sex = inputs[i].value; document.getElementById("query").action = projectName+"query.do?currentPage=1&stsex="+sex; break; } else{ document.getElementById("query").action = projectName+"query.do?currentPage=1"; } } document.getElementById("query").submit(); }
以上!