zoukankan      html  css  js  c++  java
  • 5.1 记录

    1、完善各个身份人愿信息填写时的输入限制

    2、完成情况

    注册页面,各项输入限制已完成

    <%@ page contentType="text/html;charset=UTF-8" language="java"%>
    <jsp:include page="login_head.jsp"></jsp:include>
    <form id="regForm" action="${pageContext.request.contextPath}/register"
    method="post">
    <h1>用户注册</h1>
    <div>
    <input style="margin: 0px;" type="text" name="login_mail"
    class="form-control" placeholder="注册邮箱" />
    <div style=" 350px; height: 20px; margin-bottom: 5px;">
    <span id="mail" class="help-block"
    style="margin-right: 220px; margin-top: 0px; margin-bottom: 0px;"></span>
    </div>
    </div>
    <div>
    <input style="margin: 0px;" type="password" name="pwd" maxlength="20"
    class="form-control" placeholder="密码 6-20位" />
    <div style=" 350px; height: 20px; margin-bottom: 5px;">
    <span id="pwd" class="help-block"
    style="margin-right: 220px; margin-top: 0px; margin-bottom: 0px;"></span>
    </div>
    </div>
    <div>
    <input style="margin: 0px;" type="password" name="pwd2"
    class="form-control" maxlength="20" placeholder="重复密码" />
    <div style=" 350px; height: 20px; margin-bottom: 5px;">
    <span id="pwd2" class="help-block"
    style="margin-right: 220px; margin-top: 0px; margin-bottom: 0px;"></span>
    </div>
    </div>
    <div>
    <button type="submit" class="btn btn-default">注册</button>
    </div>
    <div class="clearfix"></div>
    <div class="separator">
    <div class="clearfix"></div>
    <br />
    <div>
    <h1>
    <i class="fa fa-paw"></i> Gentelella Alela!
    </h1>
    <p>©2016 All Rights Reserved. Gentelella Alela! is a Bootstrap 3
    template. Privacy and Terms</p>
    </div>
    </div>
    </form>
    <jsp:include page="login_foot.jsp"></jsp:include>
    <script type="text/javascript">
    var msg = "${msg}";
    if (msg.length > 0) {
    if (msg = "注册成功") {
    alert(msg);
    window.location = "${pageContext.request.contextPath}/login.jsp";
    }
    }
    $(function() {
    var exp = /[1-9][0-9]{4,}@qq.com/;
    $("input[name='login_mail']").on('input propertychange', function() {
    if ($(this).val()) {
    if (!exp.test($(this).val())) {
    $(this).parent().removeClass("has-error");

    $(this).parent().addClass("has-error");
    $("#mail").text("请输入正确的邮箱格式");
    } else {
    $(this).parent().removeClass("has-error");
    $("#mail").text("");
    }
    } else {
    $(this).parent().removeClass("has-error");
    $("#mail").text("");
    }
    })
    $("input[name='pwd']").on('input propertychange', function() {
    if ($(this).val()) {
    if ($("input[name='pwd']").val().length < 6) {
    $(this).parent().removeClass("has-error");

    $(this).parent().addClass("has-error");
    $("#pwd").text("请输入正确的密码格式");
    } else {
    $(this).parent().removeClass("has-error");
    $("#pwd").text("");
    }
    } else {
    $(this).parent().removeClass("has-error");
    $("#pwd").text("");
    }
    })
    $("input[name='pwd2']").on('input propertychange', function() {
    if ($(this).val()) {
    if ($(this).val() != $("input[name='pwd']").val()) {
    $(this).parent().removeClass("has-error");

    $(this).parent().addClass("has-error");
    $("#pwd2").text("请输入正确的重复密码");
    } else {
    $(this).parent().removeClass("has-error");
    $("#pwd2").text("");
    }
    } else {
    $(this).parent().removeClass("has-error");
    $("#pwd2").text("");
    }
    })
    $("#regForm").submit(function() {
    var a = $("#mail").text();
    var b = $("#pwd").text();
    var c = $("#pwd2").text();
    var mail = $("input[name='login_mail']").val();
    var pwd = $("input[name='pwd']").val();
    var pwd2 = $("input[name='pwd2']").val();
    if (!mail) {
    $("input[name='login_mail']").parent().addClass("has-error");
    $("#mail").text("此项不能为空!");
    return false;
    }
    if (!pwd) {
    $("input[name='pwd']").parent().addClass("has-error");
    $("#pwd").text("此项不能为空!");
    return false;
    }
    if (!pwd2) {
    $("input[name='pwd2']").parent().addClass("has-error");
    $("#pwd2").text("此项不能为空!");
    return false;
    }
    if (a == "" && b == "" && c == "") {
    return true;
    } else {
    return false;
    }
    })
    })
    </script>

    3、明日任务

    社员提交社团申请表功能

  • 相关阅读:
    Extjs 集合了1713个icon图标的CSS文件
    Sencha Touch 2 DataView / List 分页
    Sencha Touch 笔记
    [奉献]通过命令快速启动应用程序的小软件(QuickLauncher V1.1)
    PTC FlexPLM rfa 接口自动创建产品规格
    Excel Vba 调用WebService的两种方式,解决MSSOAP30 64位不兼容问题
    Extjs4.1.x 框架搭建 采用Application动态按需加载MVC各模块
    C#获取远程图片,需要Form用户名和密码的Authorization认证
    [转]plsql不安装oracle客户端 进行远程连接
    WPF、Silverlight程序编码资料收集
  • 原文地址:https://www.cnblogs.com/lx06/p/14761835.html
Copyright © 2011-2022 走看看