form表单的两种方式：button(设置点击事件)和onsubmit；
1.方法一使用button提交的方式：
<form>
<div class="form-inner">
<div class="form-group layout">
<div class="col-md-6">
<label for="name" class="control-label">姓名</label>
<input type="text" class="form-control" id="name" name="name">
</div>
<div class="col-md-6">
<label for="phone" class="control-label">手机</label>
<input type="text" class="form-control" id="phone" placeholder="" name="hometel">
</div>
</div>
<div class="form-group layout">
<div class="col-md-6">
<label for="project" class="control-label">预约项目</label>
<select name="Sech" style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem">
<option value="种植">种植</option>
<option value="矫正">矫正</option>
<option value="美白">美白</option>
</select>
</div>
<div class="col-md-6">
<label for="adress" class="control-label" name="branch">预约院区</label>
<select name="branch" style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem">
<option value="成都总院">成都总院</option>
<option value="光华院区">光华院区</option>
<option value="玉双院区">玉双院区</option>
<option value="德阳院区">德阳院区</option>
<option value="自贡院区">自贡院区</option>
</select>
</div>
</div>
<div class="form-group layout">
<div class="col-md-6">
<label for="age" class="control-label">年龄</label>
<input type="text" class="form-control" id="age" name="age">
</div>
<div class="col-md-6">
<label for="project" class="control-label">性别</label>
<select style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem" name="sex">
<option value="男">男</option>
<option value="女">女</option>
</select>
</div>
</div>
</div>
<div class="form-group layout">
<div class="col-md-12">
<input type="submit" value="提交" class="btn btn-info" style="width: 1rem;font-size: .18rem;">
</div>
</div>
</form>
<script>
/*通过button提交数据*/
$('.btn ').click(function(){
$.ajax({
type:"POST",
url: "上传的数据库地址",
data:{usename(数据库名):$("#name").val()（form表单的id）,pwd(数据库名):$("#password").val()（form表单的id）},
dataType:"json",
success:function(message){
console.log(message);//返回的数据；
}
})
</script>
2.方法二使用form的onsubmit提交的方式:
<form class="form-horizontal templatemo-create-account templatemo-container" role="form" name="form1" action="上传的数据库地址" method="post" onsubmit="return zzyy();initAd();submitonce(this);">
<div class="form-inner">
<div class="form-group layout">
<div class="col-md-6">
<label for="name" class="control-label">姓名</label>
<input type="text" class="form-control" id="name" name="name">
</div>
<div class="col-md-6">
<label for="phone" class="control-label">手机</label>
<input type="text" class="form-control" id="phone" placeholder="" name="hometel">
</div>
</div>
<div class="form-group layout">
<div class="col-md-6">
<label for="project" class="control-label">预约项目</label>
<select name="Sech" style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem">
<option value="种植">种植</option>
<option value="矫正">矫正</option>
<option value="美白">美白</option>
</select>
</div>
<div class="col-md-6">
<label for="adress" class="control-label" name="branch">预约院区</label>
<select name="branch" style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem">
<option value="成都总院">成都总院</option>
<option value="光华院区">光华院区</option>
<option value="玉双院区">玉双院区</option>
<option value="德阳院区">德阳院区</option>
<option value="自贡院区">自贡院区</option>
</select>
</div>
</div>
<div class="form-group layout">
<div class="col-md-6">
<label for="age" class="control-label">年龄</label>
<input type="text" class="form-control" id="age" name="age">
</div>
<div class="col-md-6">
<label for="project" class="control-label">性别</label>
<select style="display:block;width:2.5rem;height:.5rem;border-radius:.06rem" class="projectItem" name="sex">
<option value="男">男</option>
<option value="女">女</option>
</select>
</div>
</div>
</div>
<div class="form-group layout">
<div class="col-md-12">
<input type="submit" value="提交" class="btn btn-info" style="width: 1rem;font-size: .18rem;">
</div>
</div>
</form>
<script>
/*通过调用zzyy()调用函数提交数据*/
var RegName=/^[\s\S]{1,20}$/;
var RegPhone=/^13[0-9]{9}$|^14[0-9]{9}$|^15[0-9]{9}$|^17[0-9]{9}$|^18[0-9]{9}$/;
function zzyy(){
if(!RegName.test($('#name').val())){
alert("请输入用户名");
document.form1.name.focus();
return false;
}if(!RegPhone.test($('#phone').val())){
alert("请输入电话");
document.form1.hometel.focus();
return false;
}if($('.projectItem').text()==''){
alert("请输入项目");
document.form1.Sech.focus();
return false;
}if($('#age').val()==''){
alert("请输入年龄");
document.form1.age.focus();
return false;
}
return true;
}
从上至下执行if语句，return false如果第一个不成立就返回，不执行后面的语句 ; 如果以上if全通过最后整个调用函数return true ;
<script>
方法2使用onsubmit不需要通过点击button传数据，给每个Input一个name（name="值"需要和数据库的名一样），form表单可以自行上传函数,但是上传的点击按钮还是需要<input type=submit/>
如果form表单中有<select name="branch" >（name="值"需要和数据库的名一样）,上传的数据是<option value="男">男</option><option value="女">女</option>,表单上传会自动上传option中value值