1：使用submit提交：
onSubmit用于提交前阻止表单提交，如果为false则提交，为true则不提交！
check()为提交前的验证函数，如果不符合就return false，阻止表单提交，下为样文：
复制代码
<form action="4.php" method="post" onSubmit="return check()" enctype="multipart/form-data">//enctype设置文件上传的格式（该格式为上传文件的必要格式）
<input id="name" type="text" placeholder="请输入姓名">
<input id="paw" type="text" placeholder="请输入密码">
<input type="file">
<input type="submit" value="提交">
</form>
复制代码
复制代码
<script>
check(){
var name=document.getElementById("name");
var paw=document.getElementById("paw");
if(name==""&&paw==""){
return false;
}else{
return true;
}
}
</script>
复制代码
2：使用ajax实现异步提交：
一：创建XMLHttpRequest核心对象（老师要求必须默写出来）
复制代码
function getXhr(){
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest;//除IE8外的其他浏览器
}else{
xhr=new ActiveXobject('Microsoft.XMLHttp');//IE8浏览器
}
return xhr;
}
复制代码
二：建立连接并提交（post）
复制代码
<body>
<form action="3.php" method="post" id="myform" name="myform">
用户名：<input type="text" id="user" name="user"><br>
密码：<input type="text" id="paw" name="paw"><br>
<input type="button" value="提交" id="btn">
</form>
</body>
<script>
var btn=document.getElementById("btn");
btn.onclick=function(){
var xhr=getXhr();
xhr.open("post","3.php");//与服务器建立连接
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//设置post的请求头
var user=document.getElementById("user").value;//获取到name值
var paw=document.getElementById("paw").value;//获取到paw值
xhr.send("user="+user+"&paw="+paw);//客户端向服务器端发送请求
xhr.onreadystatechange=function(){//客户端接受服务器端的响应
//保证服务器端响应的数据发送完毕
if(xhr.readyState==4){
//保证这次请求是成功的，状态码为200是成功
if(xhr.status==200){
//接受服务器端的数据
var data=xhr.responseText;
//测试
console.log(data);
}
}
}
}
</script>
复制代码
二：建立连接并提交（get）
复制代码
<script>
var btn=document.getElementById("btn");
btn.onclick=function(){
var xhr=getxhr();//创建XMLHttpRequest对象
var user=document.getElementById("user").value;//获取到name值
var paw=document.getElementById("paw").value;//获取到paw值
xhr.open("get","3.php?user="+user+"&paw="+paw+");//与服务器建立连接
xhr.send(null);//客户端向服务器端发送请求
xhr.onreadystatechange=function(){//客户端接受服务器端的响应
//alert(xhr.readyState);
//保证服务器端响应的数据发送完毕
if(xhr.readyState==4){
//保证这次请求是成功的，状态码为200是成功
if(xhr.status==200){
//接受服务器端的数据
var data=xhr.responseText;
//测试
console.log(data);
}
}
}
}
</script>
复制代码
注：send不管是post还是get都不能省略，get类型的send为send（null）并不能向服务器发送请求数据
3. jQuery中的ajax提交：
比较常用的
$get(url,data,callback,type)
//url：提交地址 data：提交数据 callback：回调函数 type：指定从服务器端回来的数据格式，默认为HTML格式，其他还有xml，json。
//post和它一样，只需将get修改为post即可。
不常用的
复制代码
$ajax({
url:"4.php",//设置请求地址
type:"post",//设置请求方式
async:"true",//设置是否异步请求
data:{name:"david",age:"20"},//发送请求的数据。只能为key：value格式
success:function(data,textStatus){//成功后的回调函数
console.log(data);
},
error:function(XMLHttpRequest,textStatus,errorThrown){//失败后的回调函数
console.log(textStatus);
},
})
复制代码
