js实现多个tab页面数据的一次性提交，每个tab页面会输入一些信息 。 求大神 本人菜鸟,求详细解答。感恩在心。

<div class="panel-heading">报案信息</div>
<div class="panel-body text-left">
<div class="row">
<div class="col-md-12">
<div class="panel-body text-left">
<ul id="myTabs" class="nav nav-pills nav-tabs" role="tablist">
<li role="presentation" class="active">
<a href="#accidentInfo" aria-controls="claimCase" role="tab" data-toggle="tab">事故录入</a>
</li>
<li role="presentation">
<a href="#deservePay" aria-controls="claimCase" role="tab" data-toggle="tab">理赔基本信息</a>
</li>
<li role="presentation">
<a href="#claimAccount" aria-controls="claimCase" role="tab" data-toggle="tab">索赔账户</a>
</li>
<li role="presentation">
<a href="#receiptUp" aria-controls="claimCase" role="tab" data-toggle="tab">发票上传</a>
</li>
<li role="presentation">
<a href="#provementUp" aria-controls="claimCase" role="tab" data-toggle="tab">证明文件上传</a>
</li>
</ul>

<div class="tab-content">
<div role="tabpanel" class="tab-pane" id="accidentInfo"></div>
<div role="tabpane2" class="tab-pane active" id="deservePay"></div>
<div role="tabpane3" class="tab-pane" id="claimAccount"></div>
<div role="tabpane4" class="tab-pane" id="receiptUp"></div>
<div role="tabpane5" class="tab-pane" id="provementUp"></div>

其中的一个tab页面 如下 其他类似：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta content="" name="description" />
<meta content="" name="author" />
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body>
<div class="portlet box blue">
<div class="portlet-title">
<div class="caption">
<i class="fa fa-comments"></i>事故信息</div>
<div class="tools">
<a href="javascript:;" class="collapse"> </a>
<a href="javascript:;" class="reload"></a>
</div>
</div>
<div class="portlet-body">
<div class="row">
<div class="col-md-12">

<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">出险人</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="acc_cust_ID" id="acc_cust_ID" placeholder=""/>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">事故日期</label>
<div class="col-xs-7">
<input type="date" class="form-control" name="acc_date" id="acc_date" placeholder=""/>
</div>
</div>
<div class="form-group" id="priorityDiv">
<label class="col-xs-5 control-label">出险原因</label>
<div class="col-xs-7">
<textarea rows="5" cols="39" id="acc_reason" name="acc_reason" placeholder=""></textarea>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">事故地点（省）</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="acc_province" id="acc_province" placeholder=""/>
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">事故地点（市）</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="acc_city" id="acc_city" placeholder=""/>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">事故地点（县）</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="acc_distreact" id="acc_distreact" placeholder=""/>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">事故描述</label>
<div class="col-xs-7">
<textarea rows="5" cols="39" id="accDesc" name="accDesc" placeholder=""></textarea>
</div>
</div>
<div class="form-group" id="concurrentSizeDiv">
<label class="col-xs-5 control-label">事故地点（街道）</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="acc_street" id="acc_street" placeholder=""/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<div class="portlet box blue">
<div class="portlet-title">
<div class="caption">
<i class="fa fa-comments"></i>报案人信息</div>
<div class="tools">
<a href="javascript:;" class="collapse"> </a>
<a href="javascript:;" class="reload"></a>
</div>
</div>
<div class="portlet-body">
<div class="row">
<div class="col-md-12">
<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">报案人与出险人关系</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="relationship" id="relationship" placeholder=""/>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">姓名</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="name" id="name" placeholder=""/>
</div>
</div>
<div class="form-group" id="priorityDiv">
<label class="col-xs-5 control-label">性别 </label>
<div class="col-xs-7">
<select class="form-control" name="gender" id="gender" placeholder="" >
<option>男</option>
<option>女</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">生日</label>
<div class="col-xs-7">
<input type="date" class="form-control" name="birthday" id="birthday" placeholder="" />
</div>
</div>

</div>
<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">证件类型</label>
<div class="col-xs-7">
<select class="form-control" name="certi_type" id="certi_type" placeholder="">
<option>居民身份证</option>
<option>士兵证</option>
<option>军官证</option>
<option>护照</option>
<option>其它</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">证件号码</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="certi_code" id="certi_code" placeholder="" />
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">手机号码</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="mobile_phone" id="mobile_phone" placeholder="" />
</div>
</div>
<div class="form-group" id="concurrentSizeDiv">
<label class="col-xs-5 control-label">邮件地址 </label>
<div class="col-xs-7">
<input type="email" class="form-control" name="email" id="email" placeholder="" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<div class="portlet box blue">
<div class="portlet-title">
<div class="caption">
<i class="fa fa-comments"></i>报案人地址信息</div>
<div class="tools">
<a href="javascript:;" class="collapse"> </a>
<a href="javascript:;" class="reload"></a>
</div>
</div>
<div class="portlet-body">
<div class="row">
<div class="col-md-12">
<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">省份</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="province_code" id="province_code" placeholder="" />
</div>
</div>

<div class="form-group" id="priorityDiv">
<label class="col-xs-5 control-label">街道</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="district_code" id="district_code" placeholder="" />
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="col-xs-5 control-label">具体地址</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="addr_detail" id="addr_detail" placeholder="" />
</div>
</div>
<div class="form-group">
<label class="col-xs-5 control-label">邮编</label>
<div class="col-xs-7">
<input type="text" class="form-control" name="postal_code" id="postal_code" placeholder="" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-xs-offset-4 col-xs-8">
<input type="button" id="sub" class="btn blue" name="btn_save" value="提交">
</div>
</div>
</body>
</html>