Form表单之get提交与post提交
Form表单之get提交与post提交
Form表单的属性action 与method：
属性 值 描述
action URL 规定当提交表单时向何处发送数据
method get/post 规定用于发送form-data的HTTP方法。（提交表单的方式）
URL可能的值：
绝对 URL — 指向其它站点（如：src="www.baidu.com"）
相对URL — 指向站点内的文件（如：scr="/Form00/getData"）
method的值 get/post
一.两种方法的优势：
1. get ：
（1）get方式获取数据后，刷新不会有负面的效果，它只是获取数据
（2）相对于 post ，get提交更加简单和更快
2. post ：
（1）post提交是无限制的
（2）post提交时不会暴露在URL上
（3）post没有数据类型的限制
（4）post是安全的，因为post的所有操作对用户来说都是看不到的，因为数据都在数据中（FormData）中
（5）相对于 get ，post 更加稳定更可靠
（6）无法使用缓存文件（更新服务器上的文件或数据库）用 post 请求
（7）向服务器发送大量数据
（8）发送包含未知符号的用户或者不想让别人看到的时
二. 两种方法的劣势：
1. get
（1）get 方法向URL添加数据时，URL的长度是有一定限制的；get有数据类型的限制，get只允许ASCll字符
（2）get是不安全的，在传送数据时，数据被放在请求的URL中，用户可以直接在游览器上直接看到提交的数据；get提交时参数会直接暴露在URL上
2.post
（1）post数据会被重新提交时可能会产生不良的后果
（2）post 相对于get来说，慢和复杂
三.两种方式的公共代码：
控制器代码↓↓
public class MainController : Controller
{
// GET: Main
public ActionResult Index()
{
return View();
}
public ActionResult GetData(string name,string sex,string address)
{
string str = name + sex + address;
return Content(str);
}
}视图中div代码↓↓
@*onsubmit="return false;" 禁用表单的自动提交方式*@
效果图 ↓↓
四.Form表单之get提交；
get提交代码如下：
function getData() {
var name = document.getElementById("txtName").value;
var sex = document.getElementById("cboSex").value;
var address = document.getElementById("txtAddress").value;
if (name != "" && sex != 0 && address != "") {
var form = document.getElementById("frm");
form.action = "/Main/GetData";
form.method = "get";
form.submit();
} else {
alert("表单填写的数据不能为空，请检查");
}
}
如上：上面就是，get提交的代码；
当我们 运行时，没填写或者漏填写时，它会出现下面这样的结果
报错，也是一种提醒；
当你全部都填写时，如下
那结果就会这样：
上面便是get提交了
五.Form表单之post提交：
代码如下
function postData() {
var name = document.getElementById("txtName").value;
var sex = document.getElementById("cboSex").value;
var address = document.getElementById("txtAddress").value;
if (name != "" && sex != 0 && address != "") {
var form = document.getElementById("frm");
form.action = "/Main/GetData";
form.method = "post";
form.submit();
} else {
alert("表单填写的数据不能为空，请检查");
}
}这个写法跟上面get表单提交差不多，就是改了个单词而已，
把 getData() 改成了 postData()
把 form.method = "get"; 改成了 form.method = "post";
这样就成了一个post提交，当然效果也一样，跟get提交一样
这是比较简单的写法，当复杂的写法可能就不一样了；