查看: 2566|回复: 0

[未处理] 如何用JS实现输入框的上下左右键快速移动功能

[复制链接]

1

主题

2

帖子

43

积分

版主

Rank: 7Rank: 7Rank: 7

积分
43
发表于 2020-12-25 17:52:09 | 显示全部楼层 |阅读模式
本帖最后由 GoodTek.Yang 于 2020-12-25 17:52 编辑

一、在Grid中实现此功能:当我们在页面上有大量输入工作时,经常会使用快捷键移动输入光标的功能使我们的录入工作变得轻松,接下来我们来了解一下在Genexus中是怎么实现的。

1、我们在相应的页面上打开控制台,观察Genexus中Grid的字段控件名生成规则,就能发现同一列下,输入框的id前缀都是一样的,只有后缀是根据行数来变化的,而且规律也很简单,第一行0001,第二行0002以此类推;而横向的id是根据我们页面中的变量名来对应的,所以只能手动获取他们的id。

2、定义完后我们通过监听按键的ASCII码值来定义不同的事件来完成。

上下移动的时候,我们只需要将当前后缀的行号进行加减即可

左右移动的时候我们通过更换列的id来实现

二、在Table中实现此功能:

Table与Grid的区别在于它的每一行与每一列都是没有规律的,只能通过上面左右移动的方法来实现。

最后把写好的JS文件在页面上加载就可以了


三、升级版
按照上面的方法完成后,发现当一个输入框输入过内容后,再回到这个输入框的时候,没有全部选中输入框的内容,修改起来不太方便,所以在上面的方法之上做了一些改动来解决这个问题:
1、写成方法调用的形式来控制

2、执行的方法换为select()

3、刷新事件中重新加载JS



本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复

使用道具 举报