分类: Html/Css2011-11-11 17:28 125人阅读 评论(0) 收藏 举报

对于B/S的系统,在页面控制上不如C/S系统那么控制灵活,就如输入的焦点问题,客户都很想通过键盘对数据进行录入,这样的要求我想100个客户中会有90个吧.

因此解决焦点获取问题是必要的.大家可以从网上找到一些方法,不过都比较麻烦,我现在介绍一种很方便的.效果也很不错的方法给大家.

我前段时间看了MS的ASP.NET讲座,在里面谈到了如何让"回车键"使文本框的焦点一个个下移.其中提了三种方法,最好的一种是这样的:

用客户端脚本在页面添加document的onkeydown事件,让页面在接受到回车事件后,进行Tab键的功能,即只要把event的keyCode由13变为9

VBScript代码:

<script language="vbscript">

sub document_onkeydown

if event.keyCode=13 then

event.keyCode=9

end if

end sub

</script>

Javascript代码如下:

<script language="javascript" for="document" event="onkeydown">

<!--

if(event.keyCode==13)

event.keyCode=9;

-->

</script>

这样的处理方式,可以实现焦点往下移动,但对于按钮也起同样的作用,一般的客户在输入完资料以后,跳到按钮后,最好能直接按"回车"进行数据的提交.因此,对上面的方法要进行一下修改,应该对于"提交"按钮不进行焦点转移.而直接激活提交.

因此我对上面的代码进行了一个修改,即判断事件的"源",是否为提交按钮,代码如下:

<script language="javascript" for="document" event="onkeydown">

<!--

if(event.keyCode==13 && event.srcElement.type!='button' && event.srcElement.type!='submit' && event.srcElement.type!='reset' && event.srcElement.type!='textarea' && event.srcElement.type!='')

event.keyCode=9;

-->

</script>

判断是否为button, 是因为在HTML上会有type="button"

判断是否为submit,是因为HTML上会有type="submit"

判断是否为reset,是因为HTML上的"重置"应该要被执行

判断是否为空,是因为对于HTML上的"<a>链接"也应该被执行,这种情况发生的情况不多,可以使用"tabindex=-1"的方式来取消链接获得焦点.

以上是我个人观点,我是在ASP.NET中进行系统开发的,我会把这个客户端脚本放在"BasePage"中,其他页面都会继承他,从而可以在很多页面进行控制. 如有其他好办法,希望大家讨论.

解决WEB页面上"焦点控制"一法的更多相关文章

  1. Web页面上的控件

    Web页面,即:.aspx文件页面的根目录下,分为了5部分 [0]-{System.Web.UI.LiteralControl} [1]-{System.Web.UI.HtmlControls.Htm ...

  2. HTML5 File接口(在web页面上使用文件)

    File接口提供了与文件相关的信息,并且运行JavaScript在web页面上去访问文件中的内容. File对象来自于用户使用input标签选择文件返回的FileList对象,来自于拖放操作的Data ...

  3. 使用python在WEB页面上生成EXCEL文件

    来自:http://blog.sina.com.cn/s/blog_5d18f85f0101bxo7.html 近日写的一个程序需要在WEB服务器上生成EXCEL文件供用户下载,研究了一下找到了以下比 ...

  4. 用overflow-y 解决web页面抖动问题

    页面抖动(左右抖动)让人视觉上很不爽.. /** original : php攻城师 http://blog.csdn.net/phpgcs **/ 最开始我也以为是 layout 不一致的原因..后 ...

  5. 解决Web Uploader上传文件和图片 延迟和not defined

    1.出现list not define时,var $list = $("#fileList"); 2.选择文件框有延迟,可能是因为选择文件类型过多 mimeTypes: 'imag ...

  6. web页面上传大文件有没有好的解决方案

    本人在2010年时使用swfupload为核心进行文件的批量上传的解决方案.见文章:WEB版一次选择多个文件进行批量上传(swfupload)的解决方案. 本人在2013年时使用plupload为核心 ...

  7. web页面上展示图片时,图片不显示,报错:ERR_CONTENT_LENGTH_MISMATCH

      问题描述 前端页面加载css,和js文件的时候,经常出现ERR_CONTENT_LENGTH_MISMATCH的报错情况.   查找问题 在单独打开hearder中css,js的网络地址是能打开的 ...

  8. 移动端web页面上滑加载更多功能

    背景介绍: 开发企业微信的一个应用,实现在企业微信中调用自己程序页面,页面加载多模块数据,向下滑加载更多,等等等等,一波三折 然后很早就成功了是这样实现的: html: <div id=&quo ...

  9. 获取用户在web页面上选中的文本

    window.getSelection().toString();

随机推荐

  1. Json之语法,格式

    JSON 文本格式在语法上与创建 JavaScript 对象的代码相同.由于这种相似性,无需解析器,JavaScript 程序能够使用内建的 eval() 函数,用 JSON 数据来生成原生的 Jav ...

  2. javascript之Date

    JSON 日期转 JS日期,我们知道,日期类型转成JSON之后,返回的数据类似这样: /Date(1379944571737)/ 但是这种日期并不能直接显示,因为根本没有人知道这是什么意思,下面提供一 ...

  3. 认识元数据和IL(中)<第四篇>

    书接上回[第二十四回:认识元数据和IL(上)],我们对PE文件.程序集.托管模块,这些概念与元数据.IL的关系进行了必要的铺垫,同时顺便熟悉了以ILDASM工具进行反编译的基本方法认知,下面是时候来了 ...

  4. python每次处理一个字符的三种方法

    python每次处理一个字符的三种方法 a_string = "abccdea" print 'the first' for c in a_string: print ord(c) ...

  5. PL/SQL --> 动态SQL调用包中函数或过程

    动态SQL主要是用于针对不同的条件或查询任务来生成不同的SQL语句.最常用的方法是直接使用EXECUTE IMMEDIATE来执行动态SQL语句字符串或字符串变量.但是对于系统自定义的包或用户自定的包 ...

  6. Linux系统编程(23)——信号的阻塞

    实际执行信号的处理动作称为信号递达(Delivery),信号从产生到递达之间的状态,称为信号未决(Pending).进程可以选择阻塞(Block)某个信号.被阻塞的信号产生时将保持在未决状态,直到进程 ...

  7. Debug of bash , perl and python

    1.bash -x   script 2.perl -d  script 3. python -m pdb script n: execute the next line s: execute the ...

  8. Unity 移动MM自签名方式

    在使用Unity接移动MM SDK的时候,最后有一个签名.  主要是把计费文件和版权文件放入APK的根目录.  搞了半天才知道前来这么简单..... 软件使用: apk签名工具apktool

  9. IOS Application生命周期

    第一阶段 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *) ...

  10. uva 714 - Copying Books(贪心 最大值最小化 二分)

    题目描写叙述开头一大堆屁话,我还细致看了半天..事实上就最后2句管用.意思就是给出n本书然后要分成k份,每份总页数的最大值要最小.问你分配方案,假设最小值同样情况下有多种分配方案,输出前面份数小的,就 ...