一种通用的输入校验方法和气球泡提示的实现(键盘用户界面模块)

日期：2007年8月3日作者：查看:[大字体中字体小字体]

键盘用户界面模块使用说明

1.       键盘用户界面模块介绍

健盘用户界面模块是一个处理WEB编程中常用的针对健盘用户界面交互功能的通用javascript模块，主要功能有输入强制性验证，回车切换输入域，快捷键执行功能按钮或切换输入域，输入域活动提示，友好提示信息显示等主要功能。

2.       模块所处位置与调用说明

该模块处在：defaultroot/platform/js/UiKey.js

调用方式为：

<script src="/defaultroot/platform/js/UiKey.js "></script>

该名必须必须放在</body>标签的前一句
提交前验证:
function SubmitForm(form)
{
    if(!checkFormInput(form)) return false;
    form.submit();
}

3.       功能介绍与实现说明

l         输入强制性验证

比如有如下输入框，该输入框只能输入数字字符，用如下方式声明

<input type="text" name="credNumber" minlength="5" maxlength="16" charset="Number" datatype="Cardnumber" nullable="true" size="40" tabindex="9" value="">

charset=”Number”属性就能定义该输入框所能输入的字符类型

注意：其实在实现上，该例子模块会自动调用isNumber(handle,keyCode)来进行验证，系统默认提供了几个验证函数，当需要其它验证方式时，可以自己定义相关的验证函数来进行验证

比如，我有一个输入框，需要输入IP地址，则可以如下声明：

Number:<input type="text" name="credNumber" minlength="5" maxlength="16" charset="Ip" datatype="Cardnumber" nullable="true" size="40" tabindex="9" value="">

然后实现isIP(handle,keyCode)函数即可纳入统一的验证框架之下

本验证只实现输入过程中的验证，至于输入完后格式正确性的验证由如下实现:
<input type="text" name="credNumber" minlength="5" maxlength="16" charset="Number" datatype="Cardnumber" nullable="true" size="40" tabindex="9" value="">
datetype=”Cardnumber”属性就能定义该输入框所需要输入的数据类型

注意：其实在实现上，该例子模块会自动调用isCardnumber(handle)来进行验证，系统默认提供了几个验证函数，当需要其它验证方式时，可以自己定义相关的验证函数来进行验证

比如，我有一个输入框，需要输入移动电话地址，则可以如下声明：

Number:<input type="text" name="Phone" minlength="5" maxlength="16" charset="Number" datatype="Mobile" nullable="true" size="40" tabindex="9" value="">

然后实现isMobile(handle)函数(其实已经实现)即可纳入统一的验证框架之下

l         回车切换输入域

一般情况下，用户在有多输入域的时候都希望在敲下回车后切换到下一输入域，本模块以统一的方式实现了，并且能够识别普通输入域与按钮（包括图片按钮，注意，只要图片有onclick事件，则认为是按钮），在按钮上敲回车将会执行该按钮功能。

要实现该功能，只要定义输入的域tabindex属性即可，如下所示

Number:<input type="text" id="test1" charset="Number" tabindex=1>

<p>

Visible:<input type="text" id="test5" charset="Visible" tabindex=2>

<p>

<IMG SRC="http://www.QQread.com/Java/D:/eclipse/workspace/PFE/defaultroot/style/tempstylefolder/images/3_ico_3.gif" border="5" WIDTH="48" HEIGHT="40" BORDER="0" charset="ddd" AccessKey="Z" onclick="alert('image1 click');" tabindex=3 >

<INPUT TYPE="button" accessKey="5" value="(1)" onclick="alert('button click');" tabindex=4>

如果一路按回车键，则焦点会按tabindex的顺序往下跳，在图片按钮与普通按钮上则不回跳，直接执行onclcik事件

l         快捷键功能

本模块能够定义各页面元素的快捷键，包括图片按钮，普通按钮，各输入域，其定义方式为设置对象的accessKey属性，如下所示

Number:<input type="text" id="test1" charset="Number" tabindex=1 accessKey=”1”>

<p>

Visible:<input type="text" id="test5" charset="Visible" tabindex=2 accessKey=”2”>

<p>

<IMG SRC="http://www.qqread.com/java/D:/eclipse/workspace/PFE/defaultroot/style/tempstylefolder/images/3_ico_3.gif" border="5" WIDTH="48" HEIGHT="40" BORDER="0" charset="ddd" accessKey="Z" onclick="alert('image1 click');" tabindex=3 >

<INPUT TYPE="button" accessKey="5" value="(1)" onclick="alert('button click');" tabindex=4>

当按下ALT+1或者ALT+2后，第一个输入框和第二个输入框会得到焦点

当按下ALT+z或者ALT+5时，图片的onclick事件与按钮的onclick事件会执行

本模块模认定义home键将焦点落在第一个输入域上，end键将焦点落在最后一个输入区域上

l         输入域活动提示

本模块会自动完成，当某一个输入域获得焦点时，会加重显示该输入域，当文本输入域

获得焦点时会自动选择其所有文本

l         友好提示信息

信息提示一直采用alert的方式，这种方式不友好，用户要点击确定后才能继续进行下去，本模块提供汽球型友好提示方式，调用方式如下：

showTip(handle,”必须输入用户名!”);

handle为输入框的句柄
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12] [13] [14] [15] [16] 下一页
一种通用的输入校验方法和气球泡提示的实现(键盘用户界面模块) 相关文章：
·2007年结婚吉日黄道吉日通用表
·PS通道抠图：给秀发飞扬的MM照片换背景
·手机小灵通解密大全
·《鬼泣3》通关鉴定评测(ps2) - 鬼泣3攻略秘籍 - 鬼泣3
·Windows XP“帮助和支持”故障与技巧点点通
·XSL/XML网页制作入门，入门到精通
·通常C#面试题
·什么是小灵通
·笔记本内存双通道（DDR2）
·影视点播生力军：PP点点通(365)点播
一种通用的输入校验方法和气球泡提示的实现(键盘用户界面模块) 相关软件
·电脑故障一查通 V2.9
·申银万国神网E通 V5.68 金典版
·全能音频转换通 V1.2
·《孤岛惊魂》通关存档
·MP4视频转换通V4.8
·五笔打字通 V7.7
·《韩语一点通4.0》+词汇完善
·MP4视频转换通 V5.0
·英语口语通 V2007新春版
·《大航海时代4威力加强版》地图全开通关存档

上一篇:javascript 函数原型

下一篇:自己写的一个支持200人在线的聊天室服务器(简化版)-------主程序文件:chatServer

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

一种通用的输入校验方法和气球泡提示的实现(键盘用户界面模块)

精品推荐

热点TOP10

特别推荐