歡迎來到DIVCSS5查找CSS資料與學習DIV CSS布局技術!
  需要傳輸的是下圖中所有的input中客戶端設置的數據
 
  整個頁面是用js生成,代碼不長,但是用了許多拼接,看起來開比較亂,頁面的核心就是下面的部分,有一些關鍵參數部分就不放了,要是覺得亂可以跳過這個
  下面開始重點,將表單中的數據以json在ajax發送給后端
 
  functionbtnChange(values){
 
  varargList=["xxx","xxx","xxx",,
 
  //。。。這里的關鍵參數刪了
 
  ];
 
  vardict={};
 
  for(vari=0;i<argList.length;i++)
 
  {
 
  dict[argList[i]+"qxl"]=$("input[name="+argList[i]+"qxl]").val();
 
  dict[argList[i]+"kkx"]=$("input[name="+argList[i]+"kkx]").val();
 
  }
 
  console.log(dict);
 
  $.ajax({
 
  beforeSend:function(XMLHttpRequest){
 
  //XMLHttpRequest.setRequestHeader("aadfasdfsdfasdsasasdcccc","ajax");
 
  },
 
  url:"/visualPage/getWarningSet/",
 
  type:"POST",
 
  dataType:"json",
 
  data:dict,
 
  complete:function(data){
 
  //console.log('aaa')
 
  },
 
  success:function(data){
 
  console.log(data);
 
  //window.open("/visualPage/returnWarning","","width=800,height=600");
 
  //$(".text").text(data.message);
 
  },
 
  });
 
  console.log(values.name);//slice(0,-3)
 
  varwarningshow=document.getElementById("warning");
 
  warningshow.style.display='block';
 
  }
 
  url為請求的地址,type提交類型(post,get等),dataType這里用json表示提交的數據格式為json,
 
  data這里是要提交的數據,以字典形式,success為服務器成功響應后要執行的函數,
 
  這里的格式和,分割符一定要注意,格式不對不會發送成功
 
  再看視圖里面
 
  fromdjango.views.decorators.csrfimportcsrf_exempt
 
  @csrf_exempt
 
  defgetWarningSet(request):
 
  ifrequest.is_ajax():
 
  #print(request.POST)
 
  elename1=[
 
  "xxx","xxx","xxx",
 
  #這里省略關鍵參數
 
  ]
 
  k=0
 
  whilek<len(elename1):
 
  startArgsSet[elename1[k]]["qxl"]=request.POST.get(elename1[k]+'qxl','')
 
  startArgsSet[elename1[k]]["kkx"]=request.POST.get(elename1[k]+'kkx','')
 
  k+=1
 
  bxml=dicttoxml.dicttoxml(startArgsSet,custom_root='warning')
 
  xml=bxml.decode('utf-8')
 
  dom=parseString(xml)
 
  pxml=dom.toprettyxml(indent='')
 
  f=open(os.path.join(settings.BASE_DIR,'visualModule/xmlData/warning.xml'),'w',encoding='utf-8')
 
  f.write(pxml)
 
  f.close()
 
  return'HTTP_'
 
  is_ajax()可以判斷是否是ajax請求,如果前段是用get來發送不用檢測
 
  直接用request.POST.get("json中的鍵值")即可獲取對應數據
 
  一般通過returnJsonResponse(name_dict)這樣來響應給前段數據,我這里沒有進行這一步,只返回了一個字符串
 
  return'HTTP_',
 
  這里是直接將數據轉換為xml存儲到服務器,只是為了序列化用戶的設置,會有別的視圖函數來專門解析xml到字典發送到前端,所以我使用ajax只是為了實時存儲用戶設置,并不會立即反饋給用戶。
 
  ajax可以用來來傳輸json,字典,字符串,數組等格式的數據
 
  下面是ajax另一種格式,比上面的格式簡化多了
 
  $.get("/add/",{'a':a,'b':b},function(ret){
 
  $('#result').html(ret);
 
  })
 
  還有JavaScript原生的用法,需要的可以自行選擇
 
  varxmlhttp;
 
  //創建ajax對象
 
  if(window.XMLHttpRequest)
 
  {//codeforIE7+,Firefox,Chrome,Opera,Safari
 
  xmlhttp=newXMLHttpRequest();
 
  }
 
  else
 
  {//codeforIE6,IE5
 
  xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
 
  }
 
  //onreadystatechange事件中的就緒狀態時執行的函數:
 
  xmlhttp.onreadystatechange=function()
 
  {
 
  if(xmlhttp.readyState==4&&xmlhttp.status==200)
 
  {
 
  document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
 
  //xml
 
  xmlDoc=xmlhttp.responseXML;
 
  txt="";
 
  x=xmlDoc.getElementsByTagName("ARTIST");
 
  for(i=0;i<x.length;i++)
 
  {
 
  txt=txt+x[i].childNodes[0].nodeValue+"<br>";
 
  }
 
  document.getElementById("myDiv").innerHTML=txt;
 
  }
 
  }
 
  //向服務器發送請求
 
  xmlhttp.open("POST","ajax_test.html",true);
 
  xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
 
  xmlhttp.send("fname=Henry&lname=Ford");
 
  

如需轉載,請注明文章出處和來源網址:http://www.8617312.live/html/h54903.shtml

老11选5开奖软件 pk10在线 二分彩万位是什么意思 广东麻将游戏 捕鱼达人1旧版本 澳大利亚快乐8开奖结果 琼崖海南麻将新版本 微信上下分捕鱼 正规网上赚钱不投资 天津麻将游戏下载手机版 网宿科技股票分析