2011年2月12日 星期六

JavaScript - 建立form,用post方法送出request

用JavaScript寫一隻小程式,能送出表單請求給伺服器。

若伺服器是用get的方法接收請求,只需在網址後面加入「?name1=value1&name2=value2&……」;但若伺服器是用post的方法接收請求,則要用建立表單的方式送出請求。



傳送post請求的函式:

function sendPost(url, params){
  var form = document.createElement("form");

  // 設定表單的一些屬性,包含網頁接收伺服器回應的頁面或框架
  form.setAttribute("method", "post");
  form.setAttribute("action", url);
  form.setAttribute("target", "Iframe1");

  // 建立隱藏的表單控制項
  for(var key in params){
    var hiddenField = document.createElement("input");
    hiddenField.setAttribute("type", "hidden");
    hiddenField.setAttribute("name", key);
    hiddenField.setAttribute("value", params[key]);
    form.appendChild(hiddenField);
  }

  // 隱藏的submit按鈕,預防瀏覽器不支援模糊的表單設計。(可不用)
  var hiddenSubmit = document.createElement("input");
  hiddenSubmit.setAttribute("type", "submit");
  hiddenSubmit.setAttribute("style", "display:none;");
  form.appendChild(hiddenSubmit);

  // 將表單加入網頁中
  document.body.appendChild(form); 

  // 送出請求
  form.submit();
}



這裡的params是用Name-Value的方式建立陣列,方式為:

var params = {'name1':'value1','name2':'value2'};

沒有留言: