㈠ js post請求模仿form表單數據格式傳輸
在開發過程中後端要求請求方式為post，但傳輸的數據格式為form表單formdata形式的。
在用axios插件請求數據時實現上述請求，可以添加 params 屬性，但是這種方式會在請求url後面拼接請求參數，與post請求有些不符。
㈡ JS部分怎麼寫才能把form表單里的數據輸出出來
JS獲取form表單里的數據並輸出的方法：
document.getElementById("ddd").innerHTML = document.getElementById("xxx").value + document.getElementById("yyy").value;
將表單數據獲取好後進行拼接賦給某個dom節點顯示出來。
js獲取表單數據命令是：document.getElementById("xxx").value;
輸出表單數據到某個dom元素內是使用：document.getElementById("ddd").innerHTML;
因此要使用js輸出表單數據可以先講表單數據整合臨時存儲到某個變數，在統一輸出到某個dom節點內
舉例：
<form id="fm" name="fm">
<input type="text" id="name" />
<input type="text" id="tel" />
<input type="button" onClick="fmResult()" />
</form>
輸出表單值：<div id="d"></div>
js:
<script>
function fmResult(){
var name = document.getElementById("name").value;
var tel = document.getElementById("tel").value;//獲取值
document.getElementById("d").innerHTML = name + tel;//輸出表單值
}
</script>
㈢ js中怎麼樣獲取從form提交後返回的json數據
同頁面下的話就需要做非同步處理，後台return json格式數據
$.ajax({
url:"後台地內址的url",
data:{
id:id
},
type:"POST",
success:function(re){
console.log(re);//列印返回容數據
}
});
㈣ JS - FormData詳解
1、將form表單元素的name與value進行組合，實現表單數據的序列化，從而減少表單元素的拼接，提高工作效率。
2、非同步上傳文件
1、創建一個空對象：
2、通過表單對formData進行初始化
創建表單：
通過表單元素作為參數，實現對formData的初始化：
1、通過get(key)與getAll(key)來獲取相對應的值
2、通過append(key,value)在數據末尾追加數據
3、通過set(key, value)來設置修改數據
key的值不存在，會添加一條數據
key的值存在，會修改對應的value值
4、通過has(key)來判斷是否存在對應的key值
5、通過delete(key)可以刪除數據
創建表單：
發送數據：
㈤ 使用js在原來的窗口來給新窗口添加內容
最近在做自己的博客，寫文章的時候有一個預覽功能，當時使用的是彈出框來進行預覽，感覺體驗不是很好。
然後想到了寫郵件時候的新窗口預覽，查了下126郵箱和qq郵箱的預覽實現效果，以及各種谷歌網路stackoverflow進行搜索。得出以下方案。
/*
* 在新窗口POST
* action: form的action屬性，要post的地址(url)
* data: form中的數據，數據格式為 [{name: "", value: ""}, {name: "", value: ""}]
* data的值可以使用jQuery的方法 $("#form1").serializeArray()獲得。
*/
createPostNewWindow: function(action, data){
var _doc = document;
var _form = _doc.createElement("form");
_form.method = "POST";
_form.target = "_blank";
_form.action = action;
data.forEach(function(element) {
var _input = _doc.createElement("input");
_input.type = "hidden";
_input.name = element.name;
_input.value = element.value;
_form.appendChild(_input);
});
_doc.body.appendChild(_form);
_form.submit();
_doc.body.removeChild(_form);
}
㈥ js或jQuery如何實現提交form表單，保存數據到資料庫，同時打開一個新的窗口，並且帶入剛保存的數據的ID
這個建議你用ajax來完成。
以jq的ajax為例
＝＝＝＝＝＝＝＝＝＝＝＝＝＝
$("#form").submit(function(){
var strArray=$(this).serializeArray();//將form表單轉為數組形式序列化表單
$.post("你要提交的後台頁面地址",strArray,function(result,status){
//result是由後台返回的id
//status是狀態，為success時成功。
if(status=="success"){
window.open("要打開的新窗口地址?id="+result);//打開一個新窗口，並用get方法傳入id
}
});
return false;//此句是防止頁面提交
});
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
以上是jq代碼。
後台代碼，要看你用的是什麼語言了。
比如說php，有個msyql_insert_id();可以獲取最後一條插入記錄的id。
如果是asp，可以用select top 1 id from 表 order by id desc的方法來獲取id。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
後台插入資料庫的代碼，就由你自己來寫了。
新打開的窗口，只需獲取id即可
㈦ form表單提交上傳圖片
上傳圖片我首先想到的是利用這個插件，webupload LUploade這類插件大多支持圖片預覽，斷點/分片上傳，功能比較豐富，但是由於後台原因我需要利用form表單進行上傳圖片，所以就整理了一下關於圖片上傳的幾種方式：
1.form表單上傳圖片
表單上傳遇到了一下幾個問題：
（1）進行表單提交時，無法獲取返回值
（2）表單提交會進行頁面刷新
為了解決這個問題，我想到了利用iframe進行解決，在form元素上直接添加target屬性，使提交跳轉頁面直接跳轉到iframe中，阻止頁面進行跳轉，返回結果也會呈現在 iframe框架之中，我們可以去除iframe中的返回值，前提是必須在同一個域名下。這樣我們獲取返回值就會擁有局限性。還好我反降了另外一種方法，jquery中jqueryj.form.js表單提交插件。我們可以直接這樣來獲取表單返回值。
form表單提交注意事項：
(1).提供form表單，method必須是post。
(2).form表單的enctype必須是multipart/form-data。
javascript學習交流群：4538335s's's's'sssssssssssssss54
enctype 屬性規定在發送到伺服器之前應該如何對表單數據進行編碼。默認地，表單數據會編碼為 "application/x-www-form-urlencoded"。就是說，在發送到伺服器之前，所有字元都會進行編碼。HTML表單如何打包數據文件是由enctype這個屬性決定的。enctype有以下幾種取值：
application/x-www-form-urlencoded：在發送前編碼所有字元(默認)(空格被編碼為』+』，特殊字元被編碼為ASCII十六進制字元)。
multipart/form-data：不對字元編碼。在使用包含文件上傳控制項的表單時，必須使用該值。
text/plain：空格轉換為 「+」 加號，但不對特殊字元編碼。
默認enctype=application/x-www-form-urlencoded，所以表單的內容會按URL規則編碼，然後根據表單的提交方法：
method=』get』 編碼後的表單內容附加在請求連接後，
method=』post』 編碼後的表單內容作為post請求的正文內容。
(3).提供input type="file"上傳輸入域。
2.ajax無刷新上傳
ajax和FormData可實現頁面無刷新的文件上傳效果，主要用到了jQuery的ajax()方法和XMLHttpRequest Level 2的
FormData介面。通過FormData對象可以更靈活方便的發送表單數據，因為可以獨立於表單使用。如果你把表單的編碼類型設置為multipart/form-data ，則通過FormData傳輸的數據格式和表單通過submit()方法傳輸的數據格式相同。
ajax無刷新上傳
Ajax無刷新上傳的方式，本質上與表單上傳無異，只是把表單里的內容提出來採用ajax提交，並且由前端決定請求結果回傳後的展示結果。
3.各類插件的使用：
webupload LUPloader
㈧ 2020-01-03 原生js中form表單提交的數據的格式
第一次寫這種文章。
1. 原生js中，form表單在提交數據的時候默認的編碼格式是application/x-www-form-urlencoded
2. 如果表單中有文件需要上傳，那麼必須在form元素中添加除了action和method（如果是get請求，可以不添加method屬性。默認情況下，form表單以get方式提交表單數據）之外的第3個屬性enctype，並且設置enctype="multipart/form-data"。
參考頁面： HTML
㈨ js如何實現Form表單submit提交截獲數據
//表單，加onsubmit="return ck(this)"部分
<form onsubmit="return ck()">
<input id="userName" />
</form>
<script>
function ck()
{
//這里就可以放各種數據的判斷，參照以下格式
if(document.getElementById("userName").value=="")
{
alert("請填寫用戶名！")
return false;
}
}
</script>
㈩ From表單提交數據的幾種方式
1,Form表單的常用屬性
2,瀏覽器提交表單時執行步驟
3,提交方法
4,常見的幾種提交方式
enctype為 form 表單數據的編碼格式，Content-type為Http傳輸的數據的編碼格式。分清兩者
1, get: 表單數據會被 encodeURIComponent 後以參數的形式: name1=value1&name2=value2附帶在 url? 後面,再發送給伺服器,並在 url 中顯示出來
2, post: enctype 默認"application/x-www-form-urlencoded"對表單數據進行編碼，數據以鍵值對在http請求體重發送給伺服器；如果enctype 屬性為"multipart/form-data"，則以消息的形式發送給伺服器"
在js中定義了其它變數，需要提交的時候攜帶，這時可以不用表單直接提交（此方法引用了jQuery插件）