• 表单验证四个步骤


    http://www.jb51.net/article/74958.htm

    一、当元素失去焦点时发生blur 事件。

    实例:jQuery blur() 方法
    添加函数到 blur 事件。当 <input> 字段失去焦点时发生 blur 事件:

    1
    2
    3
    $("input").blur(function(){
    alert("This input field has lost its focus.");
    });

    定义和用法
    当元素失去焦点时发生 blur 事件。
    blur() 方法触发 blur 事件,或规定当发生 blur 事件时运行的函数。
    提示:该方法常与 focus() 方法一起使用。
    语法
    为被选元素触发 blur 事件:

    1
    $(selector).blur()

    添加函数到 blur 事件:

    1
    $(selector).blur(function)

    二、当输入框获取焦点的时候,触发的事件。

    实例:jQuery focus() 方法
    添加函数到 focus 事件。当 <input> 字段获得焦点时发生 focus 事件:

    1
    2
    3
    $("input").focus(function(){
    $("span").css("display","inline").fadeOut(2000);
    });

    定义和用法
    当元素获得焦点时(当通过鼠标点击选中元素或通过 tab 键定位到元素时),发生 focus 事件。
    focus() 方法触发 focus 事件,或规定当发生 focus 事件时运行的函数。
    提示:该方法通常与 blur() 方法一起使用。
    语法
    触发被选元素的 focus 事件:

    1
    $(selector).focus()

    添加函数到 focus 事件:

    1
    $(selector).focus(function)

    三、当键盘键被松开时发生keyup 事件

    实例:jQuery keyup() 方法
    当键盘键被松开时,设置 <input> 字段的背景颜色:

    1
    2
    3
    $("input").keyup(function(){
    $("input").css("background-color","pink");
    });

    定义和用法
    与 keyup 事件相关的事件顺序:

    • keydown - 键按下的过程
    • keypress - 键被按下
    • keyup - 键被松开

    当键盘键被松开时发生 keyup 事件。
    keyup() 方法触发 keyup 事件,或规定当发生 keyup 事件时运行的函数。
    提示:请使用 event.which 属性来返回哪个键被按下。
    语法
    触发被选元素的 keyup 事件:

    1
    $(selector).keyup()

    添加函数到 keyup 事件:

    1
    $(selector).keyup(function)

    四、当表单提交的时候触发的事件

    实例:jQuery submit() 方法
    当提交表单时,显示警告框:

    1
    2
    3
    $("form").submit(function(){
    alert("Submitted");
    });

    定义和用法
    当提交表单时,会发生 submit 事件。
    该事件只适用于 <form> 元素。
    submit() 方法触发 submit 事件,或规定当发生 submit 事件时运行的函数。
    语法
    触发被选元素的 submit 事件:

    1
    $(selector).submit()

    添加函数到 submit 事件:

    1
    $(selector).submit(function)
  • 相关阅读:
    EditPlus 3.7 中文版已经发布
    消息队列
    工作授权系统
    MFC学习指南大纲
    亲爱的项目经理,我恨你
    那些性感的让人尖叫的程序员
    8个经典的HTML5游戏在线试玩及源码学习
    生活小插曲
    WPF开发技术介绍
    工作总结:MFC自写排序算法(升序)
  • 原文地址:https://www.cnblogs.com/annie211/p/6007950.html
Copyright © 2020-2023  润新知