数据表结构

1.html页面

<!DOCTYPE html>

<html>

    <head>

        <title>注册</title>

        <meta charset="UTF-8" />

        <!--

             js验证

         -->

        <script type="text/javascript">
 

            function validate_required(filed, alerttxt) {

                with(filed) {

                    if (value == null || value == "") {

                        alert(alerttxt);

                        return false;

                    } else {

                        return true;

                    }

                }

            }

            function validate_form(thisform) {

                with(thisform) {

                    if (validate_required(username, "用户名不能为空") == false) {

                        username.focus();

                        return false;

                    }

                    if (validate_required(pass1, "密码不能为空") == false) {

                        username.focus();

                        return false;

                    }

                    if (validate_required(pass2, "确认密码不能为空") == false) {

                        username.focus();

                        return false;

                    }

                    if (pass1.value != pass2.value) {

                        alert("两次密码不一致");

                        return false;

                    }

                }

            }

        </script>

    </head>

<!--

onSubmit="return validate(this)"这句，是一个验证表单的功能。当validate()这个函数返回值是true的时候，表单提交，反之则不提交。

-->

    <body>

        <form onsubmit="return validate_form(this) " action="jstest.php" method="post">

            <div class="1">

                <div class="1.1">

                    <div>

                        <label>用户名</label>

                    </div>

                    <div>

                        <input  type="text" placeholder="请输入用户名号" name="username">

                    </div>

                </div>

                <div class="1.2">

                    <div>

                        <label>密码</label>

                    </div>

                    <div>

                        <input type="password"  value="" name="pass1">

                    </div>

                </div>

                <div class="1.3">

                    <div>

                        <label>确认密码</label>

                    </div>

                    <div>

                        <input type="password" value=""  placeholder="" name="pass2">

                    </div>

                </div>

            </div>

            <div class="2">

                <input type="submit" name="sub" id="sub" value="注册" />

            </div>

        </form>

    </body>

</html>

2.php页面

jstest.php

<?php

require ("mysql_class.php");//引入数据库处理文件

$db = new Mysql("localhost", "root", "201122", "userdb");

if (isset($_POST["sub"])) {

    //获取表单数据

    $username = $_POST["username"];

    $pass1 = $_POST["pass1"];

    $pass2 = $_POST["pass2"];

    define("TABLENAME", "user_zhuce");

    define("SEL", "where username='$username'");

    define("COLE", "(username,password,password2)");

    define("DATEE", "('$username','$pass1','$pass2')");

    //信息是否为空

    $db -> isnull($username, $pass1, $pass2);

    //密码是否一致

    $db -> issame($pass1, $pass2);

    if ($pass1 == $pass2) {

        //查询是否有相同的用户名

        $sel = $db -> select(TABLENAME, SEL);

        $row = $db -> row($sel);

        $r = $row[0];

        if ($r == 1) {

            echo "<script type=" . "\"" . "text/javascript" . "\"" . ">" . "window.alert" . "(" . "\"" . "该用户名已被注册" . "\"" . ")" . ";" . "</script>";

            echo "<script type=" . "\"" . "text/javascript" . "\"" . ">" . "window.location=" . "\"" . "index.html" . "\"" . "</script>";

            exit ;

        }

        //插入用户信息

        $insert = $db -> insert(TABLENAME, COLE, DATEE);

        $sel = $db -> select(TABLENAME, SEL);

        $row = $db -> row($sel);

        $r = $row[0];

        if ($r == 1) {

            echo "注册成功";

        }

        $db -> dbClose();

    }

}

?>

3.数据库处理页面

mysql_class.php

<?php

header("content-type:text/html;charset=utf-8");

class Mysql {

    private $host;

    //服务器地址

    private $root;

    //用户名

    private $password;

    //密码

    private $database;

    //数据库名

    //通过构造函数初始化类

    function Mysql($host, $root, $password, $database) {

        $this -> host = $host;

        $this -> root = $root;

        $this -> password = $password;

        $this -> database = $database;

        $this -> connect();

    }

    function connect() {

        $this -> conn = mysql_connect($this -> host, $this -> root, $this -> password);

//        if($this->conn){

//            echo "连接mysql成功";

//        }else{

//            echo "连接mysql失败";

//        }

//        $this->conn=

        mysql_select_db($this -> database, $this -> conn);

//        if($this->conn){

//            echo "连接db成功";

//        }else{

//            echo "连接db失败";

//        }

        mysql_query("set names utf8");

    }

    function dbClose() {

        mysql_close($this -> conn);

    }

    function query($sql) {

        return mysql_query($sql);

    }

    function row($result) {

        return mysql_fetch_row($result);

    }

    function select($tableName, $condition) {

        return $this -> query("SELECT COUNT(*) FROM $tableName $condition");

    }

    function insert($tableName, $fields, $value) {

        $this -> query("INSERT INTO $tableName $fields VALUES$value");

    }

    function isnull($input1,$input2,$input3){

        if($input1==""||$input2==""||$input3==""){

            echo"<script type="."\""."text/javascript"."\"".">"."window.alert"."("."\""."请填写完整（php）！"."\"".")".";"."</script>";

        }

    }

    function issame($password1,$password2){

        if($password1!=$password2){

            echo"<script type="."\""."text/javascript"."\"".">"."window.alert"."("."\""."两次密码不一致！(php)"."\"".")".";"."</script>";  

        }

    }

}

?>

javascript验证前端页面的更多相关文章

  1. jquery验证前端页面

    一共三个页面 jquery.html文件(前端页面,jquery验证用户信息) jquerytest.php文件(后台处理页面) jquerydb.php文件(数据库) 数据表结构 jquery.ht ...

  2. ajax验证前端页面

    1.html页面 用ajax验证表单的时候不需要form标签,并把提交按钮由type=“submit ”改为type=“button” 数据表结构 ajax.html <!DOCTYPE htm ...

  3. javascript版前端页面RSA非对称加密解密

    最近由于项目需要做一个url传参,并在页面显示参数内容的需求,这样就会遇到一个url地址可能会被假冒, 并传递非法内容显示在页面的尴尬情况 比如xxx.shtml?server=xxx是坏人& ...

  4. JavaScript限制前端页面用户表单输入

    onkeyup事件 onkeyup 事件会在键盘按键被松开时发生. 内容来源:自成e家 1.只能输入数字 <input onkeyup = "value=value.replace(/ ...

  5. 由前端登录验证，页面跳转，携带headers token引发的思考和尝试

    目录 1 前言 2 我的实现方式与存在的问题 3 我想到的解决方案 3.1 前端跳转时携带headers{'token': token} 不就行了(经验证不可行) 3.2 前端跳转封装请求,携带hea ...

  6. web前端页面性能优化

    影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...

  7. Python之路-(js正则表达式、前端页面的模板套用、Django基础）

    js正则表达式 前端页面的模板套用 Django基础 js正则表达式: 1.定义正则表达式 /.../  用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m ...

  8. web前端页面性能优化小结

    影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...

  9. servlet自动获取前端页面提交数据

    servlet自动获取前端页面jsp提交数据 以下是本人在学习过程中,因前端页面提交参数过多,后台servlet封装实体类过于麻烦而写的一个工具类,应用于jsp/servlet数据提交后,基于MVC+ ...

随机推荐

  1. ABAP CDS - SELECT, association

    ABAP CDS - SELECT, association Syntax ... ASSOCIATION [ [min..max] ] TO target [AS _assoc] ON cond_e ...

  2. Git Cheatshell - Pro Git

    A git cheatshell based on the book: http://www.git-scm.com/book/en/v2. Repository Configuration git ...

  3. Maven项目Update Project自动恢复为JRE1.5的问题

    问题: 使用Eclipse建立Maven项目的时候,JDK默认为1.5在用户使用Config Build Path更新为最新JRE库比如1.8或者1.7的后,Maven项目显示JRE1.8 or 1. ...

  4. Centos7 grep命令简介

    grep 是一个最初用于 Unix 操作系统的命令行工具.在给出文件列表或标准输入后,grep会对匹配一个或多个正则表达式的文本进行搜索,并只输出匹配(或者不匹配)的行或文本. grep 可根据提供的 ...

  5. 剑指Offer - 九度1351 - 数组中只出现一次的数字

    剑指Offer - 九度1351 - 数组中只出现一次的数字2013-11-23 01:23 题目描述: 一个整型数组里除了两个数字之外,其他的数字都出现了两次.请写程序找出这两个只出现一次的数字. ...

  6. 《Cracking the Coding Interview》——第6章：智力题——题目6

    2014-03-20 01:14 题目:有100栈灯,一开始都关着.如果你按照n从1~100的顺序,每次都掰一下n的倍数的开关(开->关,关->开),那么到最后有多少灯是亮的? 解法:这个 ...

  7. Windows下安装jenkins，关闭jenkins，修改jenkins端口号

    1.Jenkins安装部署 在官网下载Jenkins: https://jenkins.io/download/thank-you-downloading-windows-installer-stab ...

  8. katalon系列二：selenium IDE的替代者——Katalon Recorder

    Katalon Recorder是和selenium IDE一样的一个浏览器插件,可以录制web上的操作并回放,但我个人感觉Katalon Recorder更好用.大家可以直接在chrome商店下载安 ...

  9. 生成器 yield， next ，send

    重要的yield :相当于一个断层,我们再用next取拿出每一层重要的next :生成器查看装置,查看每一个断层重要的send :和next一样查看每一个段层,不过在查看第二个断层的时候,就可以对前面 ...

  10. java初学3

    1.包装类 Java提倡的万物皆对象,但是数据类型的划分出现了基本数据类型和引用数据类型,那么我们怎么能把基本数据类型称为对象呢? Java为每个原始类型提供了封装类,Integer是java为int ...