python web py入门(55)- jQuery - 实现EMAIL地址输入检查

原创 2018年04月15日 13:38:54
在前面学习了焦点失去事件,学习了输入内容获取,学习了输出内容到页面等等,把前面所有学习过的内容,综合到一起就可以实现EMAIL地址检查了。先来看代码如下:
<html>
  <head>
    <meta charset="utf-8">
    <title>
      页面提示的例子
    </title>
    <script type="text/JavaScript" src="jquery/jquery-3.3.1.js"></script>
    <script type="text/JavaScript">
      $(document).ready(function(){
        var bd = {
              bind :  function(input_element, tip_element, validate_func, null_tip, invalid_tip) {
                var result = new Object();
                result.valid = false;
                // 为input_element绑定blur事件
                $(input_element).blur(function() {
                    var input_val = input_element.val();
                    if (input_val == "") {
                        result.valid = false;
                        $(tip_element).html(null_tip);
                    } else if (!validate_func(input_val)) {
                        result.valid = false;
                        $(tip_element).html(invalid_tip);
                    } else {
                        result.valid = true;
                        $(tip_element).html("");
                    }
                });

                return result;
              }
        };
        //测试一下对象运行
        var ret = bd.bind($("form#register #email"),
          $("form#register #email").next(),
          function(val) {return val.match(/^([.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/);},
          "< 请输入邮箱",
          "< 邮箱格式不对"
        );
        console.log(ret);
      });
    </script>
  </head>
  <body>
    <form id="register" action="" method="POST">
      <table>
        <tbody>
          <tr>
            <td><label for="email">邮箱</label></td>
            <td><input type="text" id="email" name="email" /><span class="validate_tip"></span></td>
          </tr>
          <tr>
            <td><label for="username">帐号</label></td>
            <td><input type="text" id="username" name="username" /><span class="validate_tip"></span></td>
          </tr>
          <tr><td><input type="submit" id="register_btn" value="注册" /></td></tr>
        </tbody>
      </table>
    </form>
  </body>
</html>

在这段代码,先构造一个表单,在里面有两个输入框,一个是邮箱,一个是帐号。定义bd对象,这个对象只有一个键,这个键对应一个方法,就是对检查功能函数进行绑定。 function(input_element, tip_element, validate_func, null_tip, invalid_tip)输入五个参数,第一个参数是输入的元素,第二个是提示的元素,第三个是检查功能函数,第四是没有输入时提示信息,第五是输入非法时提示信息。接着下来就是创建一个对象result来返回函数判断的结果值,如果result.valid是true说明正确,否则就是出错。在函数判断出错,会通过  $(tip_element).html()来提示出错信息到页面上面。

运行的结果如下:


通过这个例子,就把这一阶段学习的内容全部使用上了,如果不明白,就回头去看看前面的内容了。

TensorFlow入门基本教程
http://edu.csdn.net/course/detail/4369
C++标准模板库从入门到精通 
http://edu.csdn.net/course/detail/3324
跟老菜鸟学C++
http://edu.csdn.net/course/detail/2901
跟老菜鸟学python
http://edu.csdn.net/course/detail/2592



版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/caimouse/article/details/79948646

【Python】第六周 Python Web项目开发实现(下)

-
  • 1970年01月01日 08:00

检查Email格式是否合法的正则表达式

“^\\w+([-_.]?\\w+)*@\\w+([\\.-]?\\w+)*(\\.\\w{2,6})+$” 这个是我在Java程序中检查Email格式是否合法的正则表达式,在网上看到一篇博文,与我用...
  • cnmilan
  • cnmilan
  • 2016-03-02 17:36:55
  • 7223

输入一个Email地址,然后使用正则表达式验证该Email地址是否正确。

输入一个Email地址,然后使用正则表达式验证该Email地址是否正确 。 import java.util.regex.Pattern; import java.util.regex.Match...
  • Lakers1989
  • Lakers1989
  • 2017-10-26 09:15:05
  • 873

python web py入门配套源代码

  • 2018年02月23日 09:29
  • 88KB
  • 下载

web.py服务端,jquery ajax简单例子

在服务端设置好url映射后编写应对客户端的ajax post请求(新手整理思路记录用,若有错误还请指出~ class AjaxFriendReq: def POST(self): ...
  • qq_24714469
  • qq_24714469
  • 2016-01-29 16:29:10
  • 1664

python web py入门(50)- jQuery - 输入内容的检查

在前面学习了从网页上获取输入内容,它是通过jQuery的id选择器来实现的。一般情况之下,获取输入就是为了进行检查数据输入的正确性,那么怎么样判断数据的正确性,就跟你的业务逻辑有关了。比如qq的号码,...
  • caimouse
  • caimouse
  • 2018-04-14 11:50:59
  • 53

python web py入门-1-web.py简介和安装

背景         记录python web.py开发入门学习的过程,主要想通过这个入门,然后继续去学习python Django框架开发课程。目前我的个人技能状态是,稍微懂点selenium we...
  • u011541946
  • u011541946
  • 2017-09-04 22:29:28
  • 5055

python web py入门(12)- 实现用户登录论坛

前面已经介绍了怎么注册用户,当用户注册成功之后,就需要使用帐号进行登录,这个登录过程是怎么样实现的呢?首先是要有一个登录的连接,通过首页点击登录,就会进入登录的URL连接:http://127.0.0...
  • caimouse
  • caimouse
  • 2018-02-23 10:32:21
  • 571

jQuery判断email地址 邮箱地址 email regex

直接放jQuery代码: function isValidEmailAddress(emailAddress) { var pattern = /^([a-z\d!#$%&'*+\-\/=?...
  • likingsn
  • likingsn
  • 2016-04-21 14:06:05
  • 1085

sql判断Email和用户名

sql语句判断Email格式和用户名中不能有特殊字符(用户名只包含字母、数字、下划线)的语句怎么写 SELECT  email_address     FROM  email     WHE...
  • xiuhaijuanqiang
  • xiuhaijuanqiang
  • 2013-03-07 11:26:04
  • 1481
收藏助手
不良信息举报
您举报文章:python web py入门(55)- jQuery - 实现EMAIL地址输入检查
举报原因:
原因补充:

(最多只允许输入30个字)