分类: 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. hdu 1500 Chopsticks

    http://acm.hdu.edu.cn/showproblem.php?pid=1500 dp[i][j]为第i个人第j个筷子. #include <cstdio> #include ...

  2. FileAccess枚举

    FileAccess用于控制对文件的读访问.写访问或读/写访问的常熟.从源代码可以看到FileAccess是一个简单枚举. 枚举成员 成员值 描述 Read 1 对文件的读访问,拥有读取权限. Wri ...

  3. 如何不保存Word即可用Word打开想显示的内容!

    今天遇到客户需要将数据用Word预览,原来做的时候是保存到本地然后打开,客户说这样不好,因为不一定预览了一定要保存,于是我翻箱倒柜的发现真没资料啊!!幸好经过我的大量实验(好吧,我是挨个方法试的!), ...

  4. VC工程中的.rc文件和.rc2文件的区别

    rc和rc2都是资源文件,包含了应用程序中用到的所有的资源. 两者不同在于:rc文件中的资源可以直接在VC集成环境中以可视化的方法进行编辑和修改; 而rc2中的资源不能在VC的集成环境下直接进行编辑和 ...

  5. UESTC_邱老师选妹子 2015 UESTC Training for Dynamic Programming<Problem H>

    H - 邱老师选妹子 Time Limit: 3000/1000MS (Java/Others)     Memory Limit: 65535/65535KB (Java/Others) Submi ...

  6. hdu 2202 最大三角形_凸包模板

    题意:略 思路:直接套用凸包模板 #include <iostream> #include <cstdio> #include <cmath> #include & ...

  7. BarTender打印出来的条码与设计的不同如何处理

    今日有用户在使用BarTender设计打印条码时发现自己设计出来的条码与打印显示的条码有不一样的地方,也就是BarTender模板上的条码有显示警戒栏,但打印的条码警戒栏却没了,这一问题要如何解决呢? ...

  8. Android.mk文件语法规范及使用模板

    Android.mk文件语法详述 介绍:------------这篇文档是用来描述你的C或C++源文件中Android.mk编译文件的语法的,为了理解她们我们需要您先看完docs/OVERVIEW.h ...

  9. FlashBack-SCN-TIMESTAMP

    一.基于时间(as of timestamp)的flashback1.创建表create table flash_tab(id,vl) as select rownum,oname from ( se ...

  10. C#自定义控件在添加引用后不显示在工具箱的解决方法

    先说一些背景: 在开发C#项目时,发现很多控件存在复用的情况,控件的属性都是要设置成一样的,我就想,能不能设置一个类来存放这个控件,这样我每次用的时候直接加一些特殊的操作就可以了,不需要再次设置控件属 ...