基于jQuery会员中心安全修改表单代码。这是一款登录密码，交易密码，手机号码，实名认证，电子邮箱，安全设置表单，会员表单等设置代码。效果图如下：
实现的代码。
html代码：
<div class="Safety">
<dl>
<dt>
<strong>登录密码：</strong>
<span>保障账户安全，建议您定期更换密码</span>
<b><span class="glyphicon glyphicon-ok"> </span>已经设置</b>
<em>修改</em>
</dt>
<dd>
<form action="#" method="get">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">当前密码：</td>
<td><input type="text" class="safinput1" /> <span style="display:none;">直接在input后加span没问题</span></td>
</tr>
<tr>
<td width="35%" align="right">设置新密码：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">确认新密码：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><input type="submint" class="safSub" value="修改登录密码" /></td>
</tr>
</table>
</form>
</dd> <dt>
<strong>交易密码：</strong>
<span>保障资金安全，建议您交易密码区别于登录密码</span>
<b><span class="glyphicon glyphicon-exclamation-sign"> </span>未设置 </b>
<em>修改</em>
</dt>
<dd>
<form action="#" method="get">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">设置交易密码：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">确认交易密码：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><input type="submint" class="safSub" value="修改登录密码" /></td>
</tr>
</table>
</form>
</dd> <dt>
<strong>手机号码：</strong>
<span>保障账户与资金安全，是您在融合天下重要的身份凭证</span>
<b><span class="glyphicon glyphicon-ok"> </span>已经设置 </b>
<em>修改</em>
</dt>
<dd>
<ul class="Step">
<li class="stepCur"><span>1</span></li>
<li><span>2</span></li>
<li><span>3</span></li>
<div class="clearfix"></div>
</ul><!--Step/-->
<form action="#" method="get" class="sjyz-one">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">手机号：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">验证码：</td>
<td><input type="text" class="safinput2" /> <button>点击获取</button></td>
</tr>
<tr>
<td width="35%" align="right">身份证号：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><a class="safSub sjyz-one-next" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一步</a></td>
</tr>
</table>
</form>
<form action="#" method="get" class="sjyz-two">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">新手机号：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">验证码：</td>
<td><input type="text" class="safinput2" /> <button>点击获取</button></td>
</tr>
<tr>
<td width="35%" align="right">身份证号：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><a class="safSub sjyz-two-next" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一步</a></td>
</tr>
</table>
</form>
<div class="sjyz-ok"><span class="glyphicon glyphicon-ok"></span> 恭喜您,设置成功!</div>
</dd> <dt>
<strong>实名认证：</strong>
<span>保障账户安全，只有通过实名认证，才能充值投资、申请贷款</span>
<b><span class="glyphicon glyphicon-ok"> </span>已经设置 </b>
<em>修改</em>
</dt>
<dd>
<form action="#" method="get" enctype="multipart/form-data">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">用户名：</td>
<td>asdsdfasdf</td>
</tr>
<tr>
<td width="35%" align="right">真是姓名：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">身份证号：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right">正面证件照</td>
<td><input type="file" name="_f" /> </td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td>
<img src="http://gb.cri.cn/mmsource/images/2004/08/26/nc040826017.jpg" width="280" height="188" />
</td>
</tr>
<tr>
<td width="35%" align="right">背面证件照</td>
<td><input type="file" name="_f" /> </td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td>
<img src="http://www.southcn.com/tech/gdkj/200403290037_609722.jpg" width="280" height="188" />
</td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><input type="submint" class="safSub" value="提交" /></td>
</tr>
</table>
</form>
</dd> <dt>
<strong>电子邮箱：</strong>
<span>邮件接收账户通知，及时了解账户信息变动情况</span>
<b><span class="glyphicon glyphicon-exclamation-sign"> </span>未设置 </b>
<em>认证</em>
</dt>
<dd>
<ul class="Step">
<li class="stepCur"><span>1</span></li>
<li><span>2</span></li>
<li><span>3</span></li>
<div class="clearfix"></div>
</ul><!--Step/-->
<form action="#" method="get" class="sjyz-one">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">邮箱验证：</td>
<td><input type="text" class="safinput1" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><a class="safSub sjyz-one-next" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一步</a></td>
</tr>
</table>
</form>
<form action="#" method="get" class="sjyz-two">
<table width="100%" class="safForm">
<tr>
<td width="35%" align="right">邮箱验证码：</td>
<td><input type="text" class="safinput2" /></td>
</tr>
<tr>
<td width="35%" align="right"> </td>
<td><a class="safSub sjyz-two-next" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一步</a></td>
</tr>
</table>
</form>
<div class="sjyz-ok"><span class="glyphicon glyphicon-ok"></span> 恭喜您,设置成功!</div>
</dd> </dl>
</div><!--Safety/-->
