基于jQuery会员中心安全修改表单代码
基于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:;">下一步</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:;">下一步</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:;">下一步</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:;">下一步</a></td>
</tr>
</table>
</form>
<div class="sjyz-ok"><span class="glyphicon glyphicon-ok"></span> 恭喜您,设置成功!</div>
</dd> </dl>
</div><!--Safety/-->
via：http://www.w2bc.com/Article/44043
基于jQuery会员中心安全修改表单代码的更多相关文章
- 一款基于jquery ui的动画提交表单
今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览 源码下载 实现的代码. html代码: & ...
- 【表单验证】基于jQuery的高度灵活的表单验证（无UI）
表单验证是前端开发过程中常见的一个需求,产品需求.业务逻辑的不同,表单验证的方式方法也有所区别.而最重要的是我们要清楚,表单验证的核心原则是--错误信息提示准确,并且尽可能少的打扰/干扰用户的输入和体 ...
- jquery.form插件中动态修改表单数据
jquery.form jquery.form插件(http://malsup.com/jquery/form/)是大家经常会用到的一个jQuery插件,它可以很方便将表单转换为ajax的方式进行提交 ...
- 基于jQuery商品分类选择提交表单代码
分享一款基于jQuery商品分类选择提交表单代码.这是一款基于jQuery实现的商品信息选择列表表单提交代码. 在线预览 源码下载 实现的代码: <div class="yList ...
- 使用jQuery，实现完美的表单异步提交
jQuery异步提交表单 <form id="form1" method="post"> <table border="1" ...
- jquery 通过submit()方法 提交表单示例
jquery 通过submit()方法 提交表单示例: 本示例:以用户注册作为例子.使用jquery中的submit()方法实现表单提交. 注:本示例仅提供了对表单的验证,本例只用选用了三个字段作为测 ...
- jQuery Label Better – 友好的表单输入框提示插件
jQuery Label Better 帮助你标记您的表单输入域,带有美丽的动画效果而且不占用空间.这个插件的独特之处在于所有你需要做的就是添加一个占位符文本,只有当用户需要它的时候才显示标签. 您可 ...
- jquery来跨域提交表单
说说用jquery来实现跨域提交表单 在jQuery中,我们使用json数据类型,通过getJSON方法来实现从服务端获取或发送数据,而当要向不同远程服务器端提交或者获取数据时,要采用jsonp数据类 ...
- 使用jQuery实现跨域提交表单数据
我们在WEB开发中有时会遇到这种情况,比如要从A网站收集用户信息,提交给B网站处理,这个时候就会涉及到跨域提交数据的问题.本文将给您介绍如何使用jQuery来实现异步跨域提交表单数据. 在jQue ...
随机推荐
- 安卓listView实现下拉刷新上拉加载滑动仿QQ的删除功能
大家对这些功能都是看的多了,然后对上拉刷新和下拉加载的原理都是非常清楚的,所以实现这功能其实也就是为了让大家能够从众多的同行们来进行比较学习而已,虽然即使是这样,但是面试的时候面试官还是会问你上拉和下 ...
- 根据友盟统计错误分析线上的崩溃-b
登陆友盟官网找到友盟统计,找到你iOS平台下你所属的APP(图1) 图1 点击进去会出现当日错误列表,选择你发生错误的日期(图2) 图2 我们可以看到,这一天中出现了两个错误,每个错误出现在不同的时间 ...
- 外部线程停止Java子线程的方法
一.Thread.stop()官方不推荐,Because it is inherently unsafe. 二.方式一1. 线程类示例 public class ThreadT1 implements ...
- VMware Linux 共享文件夹 虚拟机无共享文件解决方法
恢复虚拟机ubuntu后,首先,点击 虚拟机——安装VMware Tools(Install VMware Tools),这时我们会在Ubuntu系统桌面上发现VMware Tools的光盘图标. 双 ...
- [转]JDBC快速入门教程
JDBC是什么? JDBC API是一个Java API,可以访问任何类型表列数据,特别是存储在关系数据库中的数据.JDBC代表Java数据库连接. JDBC库中所包含的API任务通常与数据库使用: ...
- shell编程入门（一）
运行Linux程序有三种方法: (1).使文件具有可执行权限,直接运行文件. (2).直接调用命令解释器执行程序(Linux shell是一种解释型语言). (3).使用source执行文件 第一种: ...
- pbr若干概念
pbr基于辐射传输理论,最基本的一个观点是:一切皆光源--任何一个面元既是光能接收器,也是光能发射器. 光通(flux):单位时间内通过某一面积的光能,单位W(瓦特),用表示. 可见,光通其实就是功率 ...
- WCF 有零个操作；协定必须至少有一个操作
转自 http://www.cnblogs.com/bdqlaccp/archive/2011/12/31/2308905.html 建立WCF服务后, 服务类中写上了相应的操作,并且方法上加上了[O ...
- 一篇文章学会shell工具篇之sed
sed工具执行原理; 有关sed的参数及action的常见操作方法; 定址; 模式空间和保持空间; 使用标签 1.首先先来了解一下什么是sed? sed叫做流编辑器,在shell脚本和Makefile ...
- oracle trim函数用法详解
在oracle数据库中,trim一般都是用在删除字符串两边的空格.实际上,trim也可以用来删除字符串两边的指定字符.并且trim指定删除的字符串只能是单个字符Oracle TRIM函数是很常见的函数 ...