2020-01-03 原生js中form表单提交的数据的格式

JavaScript020

2020-01-03 原生js中form表单提交的数据的格式,第1张

第一次写这种文章。

1.    原生js中,form表单在提交数据的时候默认的编码格式是application/x-www-form-urlencoded

2.    如果表单中有文件需要上传,那么必须在form元素中添加除了action和method(如果是get请求,可以不添加method属性。默认情况下,form表单以get方式提交表单数据)之外的第3个属性enctype,并且设置enctype="multipart/form-data"。

参考页面: HTML

是的,可以实现。使用原生 JavaScript 来清空 form,可以在提交表单之后调用 JavaScript 方法来清空所有表单字段,以便用户可以再次填写表单,而不必重新加载页面。

ajax({

url: "", //请求地址

type: "POST", //请求方式

data: { name: "super", age: 20 },//请求参数

dataType: "json",

success: function (response, xml) {

// 此处放成功后执行的代码

},

fail: function (status) {

// 此处放失败后执行的代码

}

})

function ajax(options) {

options = options || {}

options.type = (options.type || "GET").toUpperCase()

options.dataType = options.dataType || "json"

var params = formatParams(options.data)

if (window.XMLHttpRequest) {

var xhr = new XMLHttpRequest()

} else {

var xhr = new ActiveXObject('Microsoft.XMLHTTP')

}

xhr.onreadystatechange = function () {

if (xhr.readyState == 4) {

var status = xhr.status

if (status >= 200 &&status <300) {

options.success &&options.success(xhr.responseText, xhr.responseXML)

} else {

options.fail &&options.fail(status)

}

}

}

if (options.type == "GET") {

xhr.open("GET", options.url + "?" + params, true)

xhr.send(null)

} else if (options.type == "POST") {

xhr.open("POST", options.url, true)

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")

xhr.send(params)

}

}

function formatParams(data) {

var arr = []

for (var name in data) {

arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]))

}

arr.push(("v=" + Math.random()).replace("."))

return arr.join("&")

}