前言
最近没什么写的，写个MVC注册巩固一下
HTML

@{

    Layout = null;

}

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>注册 - 瑰园美食</title>

    <link rel="icon" href="~/Content/Images/Icon/Logo.png" />

    <link href="~/Plugin/layui/css/layui.css" rel="stylesheet" />

    <link href="~/Content/Css/LoginStyle.css" rel="stylesheet" />

</head>

<body>

    <h1>

        <span>瑰园美食</span>

        <span>享受美食带来的欢乐~</span>

    </h1>

    <div class="LoginFrom">

        <h2>注册</h2>

        <div class="LoginFrom_Input">

            <input  spellcheck="false" class="Input_User" type="text" placeholder="账号" />

            <input class="Input_Pass" type="password" placeholder="密码" />

            <input class="SuccessButton" type="button" value="点我注册" />

            <input onclick="window.location.href='/Main/Login'" type="button" value="已有账户?点击登录" />

        </div>

    </div>

    <footer>

        <p>2019 Yolx</p>

    </footer>

    <script src="~/Plugin/layui/layui.all.js"></script>

    <script>

        var User = document.querySelectorAll(".Input_User")[0];

        var Pass = document.querySelectorAll(".Input_Pass")[0];

        var xhr1 = new XMLHttpRequest();

        var SuccessButton = document.querySelectorAll(".SuccessButton")[0]

        SuccessButton.onclick = function () {

            if (User.value == "" || Pass.value == "") {

                alert("请填写完整!")

            } else {

                xhr1.open("Get", "/Main/RegisterUser?User=" + User.value + "&Pass=" + Pass.value + "");

                xhr1.responseType = "json";

                xhr1.send();

                xhr1.onreadystatechange = function () {

                    if (xhr1.status == 200 && xhr1.readyState == 4) {

                        if (xhr1.response.MsgState == true) {

                            alert(xhr1.response.MsgText);

                            window.location.href = "/Main/Login"

                        } else {

                            alert(xhr1.response.MsgText);

                        }

                    }

                }

            }

        }

    </script>

</body>

</html>

CSS

body {

    margin: 0;

    padding: 0;

    background-image: url('../Images/LoginBG.jpg');

    background-repeat: no-repeat;

    background-size: 100%;

}

h1 {

    position: fixed;

    top: 50%;

    left: 10%;

    transform: translateY(-50%);

    color: #fff;

}

    h1 span {

        display: block;

        font-size: 3vh;

    }

        h1 span:nth-child(1) {

            font-size: 5vh;

            position: relative;

            padding: 0.5vh 0px 1vh;

        }

            h1 span:nth-child(1):after {

                content: '';

                position: absolute;

                left: 0;

                top: 0;

                width: 9.8vh;

                height: 0.35vh;

                background: #fff;

            }

.LoginFrom {

    width: 24vw;

    height: 40vh;

    position: fixed;

    top: 50%;

    right: 10%;

    transform: translateY(-50%);

    background: rgba(255, 255, 255, .8);

    border-radius: 0.5vh;

    overflow: hidden;

}

    .LoginFrom h2 {

        text-align: center;

        padding: 2vh;

        background: #fff;

        font-size: 2vh;

    }

    .LoginFrom .LoginFrom_Input {

        width: 100%;

        padding: 2vh 0px;

    }

        .LoginFrom .LoginFrom_Input input {

            border: 0;

            width: 80%;

            height: 5vh;

            display: block;

            padding: 0 1vh;

            font-size: 2vh;

            margin: 1vh auto;

            box-sizing: content-box;

            position: relative;

        }

.ForgetPass, .RegisterUser {

    font-size: 1vh !important;

    position: absolute !important;

    background: none;

    width: auto !important;

    height: auto !important;

    bottom: 0px;

}

.SuccessButton {

    background:#fff;

}

.SuccessButton:after {

    content:'';

    position:absolute;

    left:0px;

    bottom:0px;

    height:2px;

    width:10px;

    background:#67b968;

}

/*.SuccessButton:hover {

    border-bottom:1vh solid #67b968;

}*/

.ForgetPass {

    left:0px;

}

.RegisterUser {

    right:0px;

}

footer {

    position: fixed;

    bottom: 0px;

    left: 0px;

    width: 100%;

}

    footer p {

        text-align: center;

        color: rgba(255, 255, 255, 0.8);

        padding: 1.5vh 0px;

        font-size: 1.5vh;

    }

/*开关组*/

.OAO_YC {

    width: 7vh;

    height: 3vh;

    background: #fff;

    border-radius: 1vh;

    padding: .5vh;

    transition: all ease 0.5s;

    position: relative;

    overflow: hidden;

    margin: 1vh 3.8vh;

}

    .OAO_YC p {

        position: absolute;

        top: 0px;

        left: 0px;

        margin: 0;

        padding: 0;

        font-size: 1.5vh;

        height: 100%;

        width: 8vh;

        text-align: center;

        line-height: 2.7em;

        opacity: 0;

        transition: all ease 0.5s;

    }

    .OAO_YC:hover p {

        opacity: 1;

    }

    .OAO_YC:hover span {

        opacity: 0.3;

    }

    .OAO_YC span {

        height: 100%;

        background: #e47575;

        border-radius: 1vh;

        display: block;

        width: 3.7vh;

        transition: all ease 0.5s;

    }

.OAO_YC_On {

    transition: all ease 0.5s;

}

    .OAO_YC_On span {

        transform: translateX(3vh);

        background: #67b968;

}

控制器

public ActionResult RegisterUser(string User, string Pass)

        {

            msg.MsgState = false;

            var list = (from tbUser in MyModel.PW_User

                        where tbUser.UserName == User.Trim()

                        select tbUser).ToList();

            if (list.Count == 0)

            {

                PW_User pW_User = new PW_User();

                pW_User.UserName = User;

                pW_User.UserPass = Pass;

                MyModel.PW_User.Add(pW_User);

                if (MyModel.SaveChanges() > 0)

                {

                    msg.MsgState = true;

                    msg.MsgText = "注册成功";

                    return Json(msg, JsonRequestBehavior.AllowGet);

                }

            }

            else

            {

                msg.MsgText = "已存在用户";

                return Json(msg, JsonRequestBehavior.AllowGet);

            }

            msg.MsgText = "注册失败!";

            return Json(msg, JsonRequestBehavior.AllowGet);

        }

登录页面点击注册按钮跳转到注册页面


注册效果

后言
本文结束了，如果觉得本技术文章对你有帮助请给我点个赞,如果有什么不足的地方，给我提意见，让我加以改进

MVC注册的更多相关文章

  1. asp.net mvc 注册中的邮箱激活功能实现（一）

    基本流程图 注册页面就不再写出,现在将发送邮件的代码粘贴出来 public ActionResult SendEmial() { ; string validataCode = System.Guid ...

  2. 更改MVC注册Areas的顺序，掌控Areas的运作

    [转自:http://www.cnblogs.com/dozer/archive/2010/04/14/change-order-of-MVC-Areas.html] 一.前言 首先,有人要问,为什么 ...

  3. asp.net mvc 注册中的邮箱激活功能实现

    基本流程图 注册页面就不再写出,现在将发送邮件的代码粘贴出来   public ActionResult SendEmial() { ; string validataCode = System.Gu ...

  4. asp.net mvc 注册中的邮箱激活功能实现（二）

    邮件发送功能封装 /// <summary>        /// 发送注册邮件        /// </summary>        /// <param name ...

  5. Asp.Net MVC及Web API框架配置会碰到的几个问题及解决方案(转)

      前言 刚开始创建MVC与Web API的混合项目时,碰到好多问题,今天拿出来跟大家一起分享下.有朋友私信我问项目的分层及文件夹结构在我的第一篇博客中没说清楚,那么接下来我就准备从这些文件怎么分文件 ...

  6. Asp.Net MVC及Web API框架配置会碰到的几个问题及解决方案

    前言 刚开始创建MVC与Web API的混合项目时,碰到好多问题,今天拿出来跟大家一起分享下.有朋友私信我问项目的分层及文件夹结构在我的第一篇博客中没说清楚,那么接下来我就准备从这些文件怎么分文件夹说 ...

  7. 转-Asp.Net MVC及Web API框架配置会碰到的几个问题及解决方案

    前言 刚开始创建MVC与Web API的混合项目时,碰到好多问题,今天拿出来跟大家一起分享下.有朋友私信我问项目的分层及文件夹结构在我的第一篇博客中没说清楚,那么接下来我就准备从这些文件怎么分文件夹说 ...

  8. 【转】Asp.Net MVC及Web API框架配置会碰到的几个问题及解决方案

    前言 刚开始创建MVC与Web API的混合项目时,碰到好多问题,今天拿出来跟大家一起分享下.有朋友私信我问项目的分层及文件夹结构在我的第一篇博客中没说清楚,那么接下来我就准备从这些文件怎么分文件夹说 ...

  9. 深入研究 蒋金楠（Artech）老师的 MiniMvc（迷你 MVC），看看 MVC 内部到底是如何运行的

    前言 跟我一起顺藤摸瓜剖析 Artech 老师的 MiniMVC 是如何运行的,了解它,我们就大体了解 ASP.NET MVC 是如何运行的了.既然是“顺藤摸瓜”,那我们就按照 ASP.NET 的执行 ...

随机推荐

  1. css3 压缩及验证工具

    1.css w3c统一验证工具 网址:http://www.csstats.com/ 如果你想要更全面的,这个神奇,你值得拥有: w3c统一验证工具:http://validator.w3.org/u ...

  2. js实现隔行变色

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. CSS、bootstrap4等相关疑难杂症

    说明 本篇博客仅用于个人随笔,所以内容比较随意. 在bootstrap4中,引入样式后,按钮.输入框等组件的选取状态会出现黑色加重边框,该如何解决? 解决示例: input:focus{outline ...

  4. Tengine更新安装

    Tengine安装及配置 一,下载 http://tengine.taobao.org/download.html 找到下载包并且下载(Tengine-2.3.2.tar.gz) wget -c ht ...

  5. java调用Oracle中的存储过程与存储函数

    1 //调用存储过程 2 public static void testPro(){ 3 String driver = "oracle.jdbc.OracleDriver"; 4 ...

  6. Python-运算符和其优先级

    运算符 算数运算符 + - * ** / // % print(4 + 5) print("a" + "b") print([1, 2] + [1, 4]) p ...

  7. 利用rtklib处理GPS以及北斗数据详解

    利用rtklib开源代码处理GPS以及北斗数据详解 在GNSS领域最基础的工作是这些GNSS系统的定位工作,对于绝大多数研究者,自己着手完成这些工作是一个"鸡肋":完全独立设计的话 ...

  8. P4821 [中山市选]生成树

    题目链接 我们可以看一下题目中给的这张图. 首先,树是没有环的,所以我们要把所有的环上的边都删去一条. 我们可以现在每个五边形上删去一条边. 但删完之后我们会发现,里面还有一圈. 这时候,我们就要在这 ...

  9. .NET Core使用FluentEmail发送邮件

    前言 在实际的项目开发中,我们会遇到许多需要通过程序发送邮件的场景,比如异常报警.消息.进度通知等等.一般情况下我们使用原生的SmtpClient类库居多,它能满足我们绝大多数场景.但是使用起来不够简 ...

  10. ansible-的修改配置文件

    1. ansible的配置文件 1 [root@1-230 python-2.7.5]# tree /etc/ansible/ 2 /etc/ansible/ 3 ├── ansible.cfg 4 ...