先贴出来两个 `PHP` 文件
>test.php
```
<?php
$result = $_POST;
print_r($result);
```
>test2.php
```
<?php
$arr = array('code'=>0,'msg'=>'请传入有效的参数','data'=>'','url'=>'test3');
echo json_encode($arr);
```
## 表单1-最开始的表单
```
<form action="test.php">
<input type="text" name="user" value="hongwei"/>
<input type="submit" id="submittest">
</form>
```
## 表单2-带有hidden的表单
```
<form action="test.php">
<input type="text" name="user" value="hongwei"/>
<input type="hidden" name="age" value="34"/>
<input type="submit" id="submittest">
</form>
```
## 表单3-ajax表单
```
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<form action="test2.php">
<input type="text" name="user" value="hongwei"/>
<button id="submittest" type="button">button</button>
</form>
<script>
$(function () {
$("#submittest").click(function(){
var data = {
"user":$("input[name='user']").val(),
"age":34
};
$.ajax({
type : "post",
url : $("form").attr('action'),
data: data,
error: function(request) {
alert("服务器繁忙, 请联系管理员!");
return;
},
success: function(ret) {
console.log(ret);
if(data.length!=0){
//todo
}else{
//todo
}
}
})
})
})
</script>
```
## 表单4：ajax-get表单
```
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<button id="submittest" type="button">button</button>
<script>
$(function () {
$("#submittest").click(function(){
$.get('test2.php',function (ret) {
console.log(ret);
})
})
})
</script>
```
## 表单5：ajax-post表单
```
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<button id="submittest" type="button">button</button>
<script>
$(function () {
$("#submittest").click(function(){
$.post('test2.php',function (ret) {
console.log(ret);
})
})
})
</script>
```
## 表单6-jquery.form表单-ajaxForm
```
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.js"></script>
<form id="myForm" action="test.php" method="post">
<input type="text" name="name">
<input type="submit" id="test" value="提交">
<div id="output1" style="display: none"></div>
</form>
<script>
$(function () {
$("#myForm").ajaxForm(function () {
$('#output1').html('提交成功！').show();
})
})
</script>
```
## 表单7-jquery.form表单-ajaxSubmit
```
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.js"></script>
<form id="myForm" action="test.php" method="post">
<input type="text" name="name">
<input type="submit" id="test" value="提交">
<div id="output1" style="display: none"></div>
</form>
<script>
$(function () {
$("#myForm").submit(function () {
$(this).ajaxSubmit(function () {
$('#output1').html('提交成功！').show();
});
return false;
})
})
</script>
```
## 有时间再继续
