頁面跳轉，form方式提交參數或數據

場景案例：頁面跳轉加載頁面。本頁面隱藏了跳轉后頁面所要展示的數據（參數），但此時不能使用get提交方式，將數據（參數）暴露在狀態欄。

解決方案：通過js，模擬表單from，post方式提交，將參數傳遞跳轉頁面的后台

效果圖：

 

 

 點擊其中的圖片跳轉業績詳情頁

 

 

 此時跳轉后的頁面所展示的數據，是通過列表頁表單的post方式提交，因此可以完全不通過get方式在狀態欄上暴露參數進行傳遞。

代碼：

html:

<ul class="bus_list">

　　<li onclick="goCpi(this)" data-url="https://test-resource-ng.ouyeel.com/statics/S3WL？path=public_oyzg/c93c2e9e22feae07792cf281001a95e4.png&amp;fileName=c93c2e9e22feae07792cf281001a95e4.png" data-content="123456">

　　　　<img src="https://test-resource-ng.ouyeel.com/statics/S3WL?path=public_oyzg/c93c2e9e22feae07792cf281001a95e4.png&amp;fileName=c93c2e9e22feae07792cf281001a95e4.png">

　　<div class="bus_title">

　　　　<p>66</p>

　　</div>

　　</li>

</ul>

js:

function goCpi(obj) {
 var imgSrc=$(obj).attr("data-url"); //獲取圖片參數
 var con=$(obj).attr("data-content");//獲取內容參數
 var type=$("#type").val();//狀態欄展示type參數（該參數不重要，因此不用隱藏）
 var num=$("#num").val();//狀態欄num參數
 var company=$("#company").val();//狀態欄company參數

 var tempForm = document.createElement("form"); //創建form表單
 tempForm.id = "tempForm1";//設置表單屬性id=“tempForm1”
 tempForm.method = "post";//設置method提交方式為Post
 tempForm.action =jump_url + '/business/cpi?type='+type+"&num="+num+"&company="+company; //頁面跳轉url（url上的參數是通過get提交）
 tempForm.target = name; // _blank - URL加載到一個新的窗口

 var hideInput = document.createElement("input"); //創建input隱藏域
 hideInput.type = "hidden";//type類型為hidden ，隱藏參數
 hideInput.name = "imgSrc"; // 設置隱藏域的name屬性為imgSrc (name="imgSrc")
 hideInput.value = imgSrc; //設置隱藏域的value值 （圖片url）
 tempForm.appendChild(hideInput); //賦值所有元素
　　　　
　　//　　以下是跳轉頁面需要的第二個參數，方式和相同，如果多個參數，依次創建多個隱藏域
 var hideInput = document.createElement("input");
 hideInput.type = "hidden";
 hideInput.name = "content";
 hideInput.value = con;
 tempForm.appendChild(hideInput);

 if(document.all){ // 兼容不同瀏覽器
 tempForm.attachEvent("onsubmit",function(){}); //IE
 }else{
 tempForm.addEventListener("submit",function(){},false); //firefox
 }
 document.body.appendChild(tempForm);
 if(document.all){ // 兼容不同瀏覽器
 tempForm.fireEvent("onsubmit");
 }else{
 tempForm.dispatchEvent(new Event("submit"));
 }
 tempForm.submit(); //表單提交
 document.body.removeChild(tempForm);
}