在用户注册账户后,为防止恶意注册,我们通常会提示用户绑定邮箱,并进行邮箱激活确定邮箱是本人在用的。以下页面都是通过thyemleaf渲染。
验证页面
我现在是已验证激活状态,如未验证会显示邮箱未验证,需点击右边验证邮箱,邮箱页面代码如下:
<div class="layui-form-item">
<label for="email" class="layui-form-label">邮箱</label>
<div class="layui-input-inline">
<input th:value="${Email}" id="email" name="email" autocomplete="off" class="layui-input" placeholder="请填写邮箱"/>
<em th:style="${Email!=null && Email.length() != 0?'color:#c00;display:inline':'display:none'}"th:text="${EmailVerify=='1'?'(已验证)':'(尚未验证)'}"></em>
</div>
<div class="layui-form-mid layui-word-aux">
如果您在邮箱已激活的情况下,变更了邮箱,需<a href="/aa/email" style="font-size: 12px; color: #4f99cf;">重新验证邮箱</a>。
</div>
</div>
别忘了验证邮箱合不合法
var field = data.field;
var emailreg = new RegExp("^[a-z0-9A-Z]+[- | a-z0-9A-Z . _]+@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\\.)+[a-z]{2,}$");
var email = field.email;
if (!emailreg.test(email) && email != null && email.length != 0) {
layer.msg("邮箱不合法");
return false;
}
点击验证邮箱跳转到邮箱验证页面,如果你不需要跳转,也可以直接点击验证,在js里获取input的值跳转后台方法即可,我因为有些提示和要求需要展示,所以先跳转到另一个页面再激活,代码如下:
<div class="fly-panel fly-panel-user" pad20>
<div class="layui-tab layui-tab-brief" lay-filter="user">
<ul class="layui-tab-title">
<li class="layui-this">
激活邮箱
</li>
</ul>