CN104077313B - 一种网页页面中多输入框的显示方法、装置及终端设备 - Google Patents

一种网页页面中多输入框的显示方法、装置及终端设备 Download PDF

Info

Publication number
CN104077313B
CN104077313B CN201310105619.4A CN201310105619A CN104077313B CN 104077313 B CN104077313 B CN 104077313B CN 201310105619 A CN201310105619 A CN 201310105619A CN 104077313 B CN104077313 B CN 104077313B
Authority
CN
China
Prior art keywords
input frame
webpage
terminal device
focus
input
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201310105619.4A
Other languages
English (en)
Other versions
CN104077313A (zh
Inventor
舒玉强
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Tencent Technology Shenzhen Co Ltd
Original Assignee
Tencent Technology Shenzhen Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Tencent Technology Shenzhen Co Ltd filed Critical Tencent Technology Shenzhen Co Ltd
Priority to CN201310105619.4A priority Critical patent/CN104077313B/zh
Priority to PCT/CN2013/089116 priority patent/WO2014153986A1/en
Priority to US14/284,700 priority patent/US9916291B2/en
Publication of CN104077313A publication Critical patent/CN104077313A/zh
Application granted granted Critical
Publication of CN104077313B publication Critical patent/CN104077313B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577Optimising the visualization of content, e.g. distillation of HTML documents

Landscapes

  • Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Data Mining & Analysis (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明适用于计算机技术领域,提供了一种网页页面中多输入框的显示方法、装置以及终端设备,所述方法包括:所述方法包括:获取终端设备当前显示的网页页面内的焦点输入框;在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。本发明使得对输入框进行过程中,无需关闭其它的界面面或者移动输入框,便可直接对输入框进行操作。

Description

一种网页页面中多输入框的显示方法、装置及终端设备
技术领域
本发明属于计算机技术领域,尤其涉及一种网页页面中多输入框的显示方法、装置以及终端设备。
背景技术
随着移动终端及互联网技术的发展,人们经常通过移动终端获取互联网上的各种资讯信息,在网页浏览过程中,通常需要在网页登陆页面输入登录信息,或者在注册页面的多个输入框中输入注册信息,其中,登录页面或者注册页面通常包括多个输入框,然而,移动终端的屏幕空间有限,在所述多个输入框的输入过程中,经常会出现输入框被其他的界面覆盖而无法进行输入的情况,例如,输入框可能被输入法软键盘覆盖,请参阅图1为网页页面包括多个输入框的示意图,对多个输入框的输入过程如下:点击账号A框之后,弹出输入法的软键盘,其它的输入框B、C、D就被输入法软键盘挡住,即此时只能对A框进行操作,如果想在密码框B中输入密码的话,必须关闭输入法,将输入法的软键盘收起,重新点击密码框B才能够输入密码,密码框B输入完毕之后,要想点击确定框,因为确定按钮也被输入法软键盘挡住,则还需要关闭输入法,将输入法的软键盘收起,才能够点击确定按钮。
综上,现有技术在对移动终端网页中的多个输入框进行操作时,当输入框被其它的界面覆盖时,需要关闭所述界面或者手动移动网页页面,才能实现对其它的输入框进行操作。
发明内容
本发明实施例的目的在于提供一种网页页面中多输入框的显示方法,旨在解决现有技术在对移动终端网页中的多个输入框进行操作时,当输入框被其它的界面覆盖时,需要关闭所述界面或者手动移动网页页面,才能实现对其它的输入框进行操作。
为了实现上述目的,本发明实施例提供如下技术方案:
本发明的第一个方面提供了一种网页页面中多输入框的显示方法,所述方法包括:
获取终端设备当前显示的网页页面内的焦点输入框;
在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本发明的第二个方面提供了一种网页页面中多输入框的显示装置,所述装置包括:
获取单元,用于获取终端设备当前显示的网页页面内的焦点输入框;
查找单元,用于在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
滚动单元,用于当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本发明实施例与现有技术相比,有益效果在于:获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框,当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。由于对焦点输入框进行操作时,如果当前页面内还有其它的输入框且其它的输入框位于某一界面的下层时,可以自动将当前页面内的其它的输入框移动至终端设备屏幕的可视区域内,使得对输入框进行过程中,无需关闭其它的界面或者移动网页页面,便可直接对输入框进行操作。
附图说明
为了更清楚地说明本发明实施例的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本发明实施例提供的网页页面包括多个输入框的示意图;
图2是本发明实施例一提供的网页页面中多输入框的显示方法的实现的流程图;
图3是本发明实施例二提供的网页页面中多输入框的显示方法的实现的流程图;
图4是本发明实施例三提供的网页页面中多输入框的显示方法的实现的流程图;
图5是本发明实施例三提供的对图1的网页页面进行解析获得的DOM树的示意图;
图6是本发明实施例三提供的终端设备显示页面中焦点输入框和与所述焦点输入框距离最近的输入框的示意图;
图7是本发明实施例三提供的计算网页页面滚动的距离和/或终端设备屏幕的画布滚动的距离的示意图;
图8是本发明实施例四提供的网页页面中多输入框的显示装置的结构图;
图9是本发明实施例五提供的网页页面中多输入框的显示装置的结构图;
图10是本发明实施例六提供的网页页面中多输入框的显示装置的结构图。
具体实施方式
为了使本发明的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本发明进行进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
本实施例中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框,当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。实现无需关闭其它的界面或者移动网页页面,便可直接对输入框进行操作。
以下结合具体实施例对本发明的实现进行详细描述:
实施例一
图2示出了本发明实施例一提供的网页页面中多输入框的显示方法的实现的流程图,详述如下:
在S201中,获取终端设备当前显示的网页页面内的焦点输入框;
本实施例中,所述的终端设备可以是计算机、智能手机、掌上电脑、平板电脑等。尤其适用于对于屏幕较小的便携式终端设备如手机、掌上电脑、平板电脑等。
本实施例中,所述当前显示的网页页面可以为登录页面或者注册页面,所述焦点输入框是用户当前正在操作的输入框。
在S202中,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
本实施例中,所述输入框可以是登陆及其注册页面的按钮,例如,可以是一个密码输入框、一个确定按钮键或者一个取消按钮键等等,所述预设距离范围可以根据用户需要预先在程序中设定查找的距离范围。
在S203中,当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本实施例中,所述某一界面可以是所述当前显示页面内的界面,还可以是浮动于当前显示页面上的界面,例如,输入法软键盘,各种广告页面等。
本实施例中,终端设备屏幕的画布为位于终端设备屏幕图层最下方的绘制层。
本实施例中,所述其它的输入框位于某一界面的下层,即所述其它的输入框被所述某一界面覆盖,用户无法直接对所述输入框进行输入,所述某一界面可能为输入法软键盘界面、或者是其它应用程序的界面。
本实施例中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框,当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。由于在对输入框进行操作过程中,如果当前页面内还有其它的输入框且其它的输入框位于某一界面的下层时,可以自动将当前页面内的其它的输入框移动至终端设备屏幕的可视区域内,使得无需关闭其它的界面或者移动网页页面,便可直接对输入框进行操作。
实施例二
图3示出了本发明实施例二提供的网页页面中多输入框的显示方法的实现的流程图,详述如下:
在S301中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的输入过程中显示输入法软键盘;
本实施例中,在所述焦点输入框的输入过程中,所述输入法软键盘通常显示与所述输入框的下方,以方便用户进行操作,而此时,位于焦点输入框下面的其它的输入框可能被所述输入法软键盘覆盖。
在S302中,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
本实施例中,查找到的输入框可能为一个也可能是多个。
在S303中,当所述其它的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本实施例中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的输入过程中显示输入法软键盘,在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框,当所述其它的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。由于在对输入框进行操作过程中,将位于所述输入法软键盘的下层的输入框,移至终端设备屏幕的可视区域内,使得对输入框进行过程中,无需关闭输入法软件盘或者移动输入框,便可直接对输入框进行操作。
实施例三
图4示出了本发明实施例三提供的网页页面中多输入框的显示方法的实现的流程图,详述如下:
在S401中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的输入过程中显示输入法软键盘;
在S402中,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框;
本实施例中,所述S402具体为:
1、获取所述网页页面的文件对象模型(Document Object Model,DOM)树;
本实施例中,页面加载的时候会对图1中的登录网页页面进行解析,获取所述登录页面的DOM树,请参阅图5。
2、在所述DOM树中,查找所述焦点输入框对应的form父节点;
3、遍历以所述form父节点为根节点的DOM树,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框。
上述根据解析后的DOM树,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框,可以采用以下程序流程:
focusNode=A; 获取当前的焦点输入框的结点A;
form=parent(A); 得到节点A的form父节点;
preorder(form); 遍历所述form为根节点的dom树;
if nodeisinput(n)&&rect(A).bottom<rect(n).y,retuun n;nodeisInput(n):判定n是否为input标签,返回true则是;否则不是,rect(A):得到节点A的render坐标值,以rect方式描述。
在S403中,当所述距离最近的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
本实施例中,对于便携是终端设备,其显示屏幕较小,为了能够显示更多的其它内容,可以在当前焦点输入框输入的过程中,仅将位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框同时显示,例如,对于图1中的输入框A、B、C、D,点击A的时候,如果可视区域能够同时容纳A和B的话,会把B也显示出来。类似,点击B的时候,如果可视区域能够同时容纳B和C的话,也会把C也显示出来(因为C和D在同一行,所以也会显示出来)。
可选的,S403中滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内可以采用以下方式:
当所述网页页面可向上滚动时,向上滚动所述网页页面,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;
或者当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;
或者当所述网页页面的底端滚动至屏幕底端时,所述焦点输入框和所述距离最近的输入框还未同时显示于终端设备屏幕的可视区域内,则向上滚动终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
本实施例中,通过网页页面滚动,终端设备屏幕的画布滚动,或者网页页面滚动和终端设备屏幕的画布的联合滚动,确保使得所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内,以便对当前焦点输入框操作完成后,可以及时、方便的对距离最近的输入框进行操作。
可选的,S403可以采用以下方式实现:
计算所述焦点输入框的上边缘和所述距离最近的输入框的下边缘之间的距离inputDisY,所述输入法软键盘上边缘与所述终端设备屏幕上边缘的距离H,所述焦点输入框的上边缘到所述输入法软键盘上边缘之间的距离X,所述距离最近的输入框在目标位置的下边缘到所述距离最近的输入框在原始位置的下边缘的距离Y,终端设备屏幕的下边缘到网页页面下边缘的距离Z;
当H>inputDisY时,根据X、Y、Z计算之间的关系,计算网页页面滚动的距离bitmapDisY和/或终端设备屏幕的画布滚动的距离canvasDisY;
根据所述bitmapDisY和canvasDisY,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
为了便于理解,以下一个具体的实现示例对本实施例中对上述滚动过程进行说明,但不以本实现示例的情况为限,请参阅图6,为终端设备屏幕A,以所述终端设备屏幕的左上角为原点建立坐标系,向右水平方向的正方向、向下为垂直方向的正方向,其中,虚线框B为网页页面,输入框C为网页页面内的焦点输入框,输入框D为与所述焦点输入框距离最近的输入框,E为输入法软键盘框,P2为所述输入框D的原始位置,P1为所述输入框D的目标位置,所述目标位置为页面移动后,输入框D所在的位置,H为所述输入法软键盘上边缘与所述终端设备屏幕上边缘的距离,X为所述焦点输入框的上边缘到所述输入法软键盘上边缘之间的距离,Y为所述距离最近的输入框在目标位置的下边缘到所述距离最近的输入框在原始位置的下边缘的距离,Z为终端设备屏幕的下边缘到网页页面下边缘的距离,则S403实现过程具体为:
1、计算所述焦点输入框的上边缘和所述距离最近的输入框的下边缘之间的距离inputDisY;
inputDisY=rect(D).bottom-rect(C).top
2、计算网页页面滚动的距离bitmapDisY和/或终端设备屏幕的画布滚动的距离canvasDisY,并根据计算结果滚动页面和/或设备屏幕的画布,请参阅图7;
S701、计算出X,Y,Z;
S702、H是否小于inputDisY,如果H<inputDisY,那么此时设备屏幕无法同时显示输入框C和输入框D,执行S703;如果H≥inputDisY,X=X+inputDisY,Y=Y+inputDisY,执行S703;
S703、X是否小于0,如果X<0,那么bitmapDisY=0,canvasDisY=0,计算完毕,执行S706;如果X>0,执行S704;
S704、判断Z是否等于0,如果Z=0,那么bitmapDisY=0,canvasDisY=Y,计算完毕,执行S706;如果Z≠0,执行S705;
S705、判断Y是否大于等于Z,果Y≥Z,那么bitmapDisY=Z,canvasDisY=Y-Z,计算完毕,执行S706,如果Y<Z,那么bitmapDisY=Y,canvasDisY=0,计算完毕,执行S706。
S706、如果bitmapDisY>0,则进行内部滚动(即网页的向上滚动);如果canvasDisY>0,则进行画布滚动,最终输入框C和输入框D会合理地显示在屏幕的可视区域。
本实施例中,获取终端设备当前显示的网页页面内的焦点输入框,在所述焦点输入框的输入过程中显示输入法软键盘,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框,当所述距离最近的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。由于在对输入框进行操作过程中,将与所述焦点输入框距离最近的、且位于所述输入法软键盘的下层的输入框,移至终端设备屏幕的可视区域内,使得无需关闭输入法软件盘或者移动输入框,便可直接对输入框进行操作。
实施例四
图8示出了本发明实施例四提供的网页页面中多输入框的显示装置的结构图,为了便于说明,仅示出了与本发明实施例相关的部分,该装置可以是内置于终端设备中的软件单元、硬件单元或者软硬结合单元。
所述装置包括:获取单元81、查找单元82及滚动单元83。
获取单元81,用于获取终端设备当前显示的网页页面内的焦点输入框;
查找单元82,用于在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
滚动单元83,用于当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本发明实施例提供的网页页面中多输入框的显示装置可以使用在前述对应的方法实施例一中,详情参见上述实施例一的描述,在此不再赘述。
实施例五
图9示出了本发明实施例五提供的网页页面中多输入框的显示装置的结构图,为了便于说明,仅示出了与本发明实施例相关的部分,该装置可以是内置于终端设备中的软件单元、硬件单元或者软硬结合单元。
所述装置包括:获取单元91、显示单元92、查找单元93及滚动单元94。
获取单元91,用于获取终端设备当前显示的网页页面内的焦点输入框;
显示单元92,用于在所述焦点输入框的输入过程中显示输入法软键盘;
查找单元93,用于在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
滚动单元94,用于当所述其它的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框显同时示于终端设备屏幕的可视区域内。
本发明实施例提供的网页页面中多输入框的显示装置可以使用在前述对应的方法实施例二中,详情参见上述实施例二的描述,在此不再赘述。
实施例六
图10示出了本发明实施例六提供的网页页面中多输入框的显示装置的结构图,为了便于说明,仅示出了与本发明实施例相关的部分,该装置可以是内置于终端设备中的软件单元、硬件单元或者软硬结合单元。
所述装置包括:获取单元101、显示单元102、查找单元103及滚动单元104。
获取单元101,用于获取终端设备当前显示的网页页面内的焦点输入框;
显示单元102,用于在所述焦点输入框的输入过程中显示输入法软键盘;
查找单元103,用于查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框;
滚动单元104,用于当所述距离最近的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
可选的,查找单元103包括:
获取模块1031,用于获取所述网页页面的DOM树;
查找模块1032,用于在所述DOM树中,查找所述焦点输入框对应的form父节点;
遍历模块1033,用于遍历以所述form父节点为根节点的DOM树,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框。
可选的,所述滚动单元103,具体用于当所述网页页面可向上滚动时,向上滚动所述网页页面,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;以及当所述网页页面的底端滚动至屏幕底端时,所述焦点输入框和所述距离最近的输入框还未同时显示于终端设备屏幕的可视区域内,则向上滚动终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
可选的,所述滚动单元104包括:
计算模块1041,用于计算所述焦点输入框的上边缘和所述距离最近的输入框的下边缘之间的距离inputDisY,所述输入法软键盘上边缘与所述终端设备屏幕上边缘的距离H,所述焦点输入框的上边缘到所述输入法软键盘上边缘之间的距离X,所述距离最近的输入框在目标位置的下边缘到所述距离最近的输入框在原始位置的下边缘的距离Y,终端设备屏幕的下边缘到网页页面下边缘的距离Z;
所述计算模块1041,还用于当H>inputDisY时,根据X、Y、Z计算之间的关系,计算网页页面滚动的距离bitmapDisY和/或终端设备屏幕的画布滚动的距离canvasDisY;
滚动执行模块1042,用于根据所述bitmapDisY和canvasDisY,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
本发明实施例提供的网页页面中多输入框的显示装置可以使用在前述对应的方法实施例三中,详情参见上述实施例三的描述,在此不再赘述。
值得注意的是,上述实施例中,所包括的各个单元只是按照功能逻辑进行划分的,但并不局限于上述的划分,只要能够实现相应的功能即可;另外,各功能单元的具体名称也只是为了便于相互区分,并不用于限制本发明的保护范围。
另外,本领域普通技术人员可以理解实现上述各实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成,相应的程序可以存储于一计算机可读取存储介质中,所述的存储介质,如ROM/RAM、磁盘或光盘等。
以上所述仅为本发明的较佳实施例而已,并不用以限制本发明,凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等,均应包含在本发明的保护范围之内。

Claims (13)

1.一种网页页面中多输入框的显示方法,其特征在于,所述方法包括:
获取终端设备当前显示的网页页面内的焦点输入框;
在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内,其中包括:当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布。
2.如权利要求1所述的方法,其特征在于,所述方法包括:
在所述焦点输入框的输入过程中显示输入法软键盘;
所述当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内具体为:
当所述其它的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内。
3.如权利要求2所述的方法,其特征在于,所述在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框具体为:
查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框;
所述当所述其它的输入框位于所述输入法键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内具体为:
当所述距离最近的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
4.如权利要求3所述的方法,其特征在于,所述查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框具体为:
获取所述网页页面的DOM树;
在所述DOM树中,查找所述焦点输入框对应的form父节点;
遍历以所述form父节点为根节点的DOM树,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框。
5.如权利要求3或4所述的方法,其特征在于,所述滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内具体为:
当所述网页页面可向上滚动时,向上滚动所述网页页面,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;
当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;
当所述网页页面的底端滚动至屏幕底端时,所述焦点输入框和所述距离最近的输入框还未同时显示于终端设备屏幕的可视区域内,则向上滚动终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
6.如权利要求3或4所述的方法,其特征在于,所述滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内具体为:
计算所述焦点输入框的上边缘和所述距离最近的输入框的下边缘之间的距离inputDisY,所述输入法软键盘上边缘与所述终端设备屏幕上边缘的距离H,所述焦点输入框的上边缘到所述输入法软键盘上边缘之间的距离X,所述距离最近的输入框在目标位置的下边缘到所述距离最近的输入框在原始位置的下边缘的距离Y,终端设备屏幕的下边缘到网页页面下边缘的距离Z;
当H>inputDisY时,根据X、Y、Z之间的关系,计算网页页面滚动的距离bitmapDisY和/或终端设备屏幕的画布滚动的距离canvasDisY;
根据所述bitmapDisY和canvasDisY,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
7.一种网页页面中多输入框的显示装置,其特征在于,所述装置包括:
获取单元,用于获取终端设备当前显示的网页页面内的焦点输入框;
查找单元,用于在所述焦点输入框的预设距离范围内,查找所述网页页面内其它的输入框;
滚动单元,用于当所述其它的输入框位于某一界面的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内,其中包括:当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布。
8.如权利要求7所述的装置,其特征在于,所述装置还包括:
显示单元,用于在所述焦点输入框的输入过程中显示输入法软键盘;
所述滚动单元,具体用于当所述其它的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述其它的输入框同时显示于终端设备屏幕的可视区域内。
9.如权利要求8所述的装置,其特征在于,所述查找单元,具体用于查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框;
所述滚动单元,具体用于当所述距离最近的输入框位于所述输入法软键盘的下层时,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
10.如权利要求9所述的装置,其特征在于,所述滚动单元包括:
获取模块,用于获取所述网页页面的DOM树;
查找模块,用于在所述DOM树中,查找所述焦点输入框对应的form父节点;
遍历模块,用于遍历以所述form父节点为根节点的DOM树,查找所述网页页面内位于所述焦点输入框下方,且与所述焦点输入框距离最近的输入框。
11.如权利要求9或10所述的装置,其特征在于,所述滚动单元,具体用于当所述网页页面可向上滚动时,向上滚动所述网页页面,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;当所述网页页面不可向上滚动时,向上滚动所述终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内;以及当所述网页页面的底端滚动至屏幕底端时,所述焦点输入框和所述距离最近的输入框还未同时显示于终端设备屏幕的可视区域内,则向上滚动终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
12.如权利要求9或10所述的装置,其特征在于,所述滚动单元包括:
计算模块,用于计算所述焦点输入框的上边缘和所述距离最近的输入框的下边缘之间的距离inputDisY,所述输入法软键盘上边缘与所述终端设备屏幕上边缘的距离H,所述焦点输入框的上边缘到所述输入法软键盘上边缘之间的距离X,所述距离最近的输入框在目标位置的下边缘到所述距离最近的输入框在原始位置的下边缘的距离Y,终端设备屏幕的下边缘到网页页面下边缘的距离Z;
所述计算模块,还用于当H>inputDisY时,根据X、Y、Z计算之间的关系,计算网页页面滚动的距离bitmapDisY和/或终端设备屏幕的画布滚动的距离canvasDisY;
滚动执行模块,用于根据所述bitmapDisY和canvasDisY,滚动网页页面和/或终端设备屏幕的画布,以使所述焦点输入框和所述距离最近的输入框同时显示于终端设备屏幕的可视区域内。
13.一种终端设备,其特征在于,所述终端设备包括权利要求7至12任一权利要求所述的网页页面中多输入框的显示装置。
CN201310105619.4A 2013-03-28 2013-03-28 一种网页页面中多输入框的显示方法、装置及终端设备 Active CN104077313B (zh)

Priority Applications (3)

Application Number Priority Date Filing Date Title
CN201310105619.4A CN104077313B (zh) 2013-03-28 2013-03-28 一种网页页面中多输入框的显示方法、装置及终端设备
PCT/CN2013/089116 WO2014153986A1 (en) 2013-03-28 2013-12-11 Method, apparatus, and terminal device for displaying multiple input boxes in a web page
US14/284,700 US9916291B2 (en) 2013-03-28 2014-05-22 Method, apparatus, and terminal device for displaying multiple input boxes in a web page where display space is limited

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201310105619.4A CN104077313B (zh) 2013-03-28 2013-03-28 一种网页页面中多输入框的显示方法、装置及终端设备

Publications (2)

Publication Number Publication Date
CN104077313A CN104077313A (zh) 2014-10-01
CN104077313B true CN104077313B (zh) 2018-02-27

Family

ID=51598573

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201310105619.4A Active CN104077313B (zh) 2013-03-28 2013-03-28 一种网页页面中多输入框的显示方法、装置及终端设备

Country Status (2)

Country Link
CN (1) CN104077313B (zh)
WO (1) WO2014153986A1 (zh)

Families Citing this family (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106708349A (zh) * 2015-07-17 2017-05-24 阿里巴巴集团控股有限公司 一种提供对象信息的方法和设备
CN106201185B (zh) * 2016-06-29 2021-07-06 海尔优家智能科技(北京)有限公司 一种浏览器中输入框的定位方法、装置及移动设备
CN106873862A (zh) * 2016-08-23 2017-06-20 阿里巴巴集团控股有限公司 一种信息输入方法和装置
CN106502573A (zh) * 2016-11-22 2017-03-15 天脉聚源(北京)传媒科技有限公司 一种视图界面移动的方法及装置
CN107577388B (zh) * 2017-08-29 2020-06-16 苏州麦迪斯顿医疗科技股份有限公司 输入界面的控制方法及装置
CN107734196A (zh) * 2017-11-28 2018-02-23 福建中金在线信息科技有限公司 防止键盘遮挡输入源的方法和系统
CN109246069B (zh) * 2018-06-15 2020-10-16 华为技术有限公司 网页登录方法、装置和可读存储介质
CN109725821B (zh) * 2018-12-29 2021-06-18 北京金山安全软件有限公司 一种组件显示方法及装置
CN110262749B (zh) * 2019-06-27 2021-05-28 北京思维造物信息科技股份有限公司 一种网页操作方法、装置、容器、设备及介质
CN110515618B (zh) * 2019-07-10 2024-02-09 西安立人行档案文件管理咨询有限公司 页面信息录入优化方法、设备、存储介质及装置
CN113467693B (zh) * 2021-06-30 2023-07-21 网易(杭州)网络有限公司 界面控制方法、装置和电子设备

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1841361A (zh) * 2005-03-31 2006-10-04 微软公司 可滚动并可调整大小的公式栏
CN102364424A (zh) * 2011-06-30 2012-02-29 广州市动景计算机科技有限公司 用于定位输入框的方法、装置、浏览器及移动终端

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20060033724A1 (en) * 2004-07-30 2006-02-16 Apple Computer, Inc. Virtual input device placement on a touch screen user interface
US7036086B2 (en) * 2001-01-04 2006-04-25 Intel Corporation Displaying software keyboard images
CN101593184B (zh) * 2008-05-29 2013-05-15 国际商业机器公司 自适应地定位动态网页元素的系统和方法
KR20110029278A (ko) * 2009-09-15 2011-03-23 삼성전자주식회사 단축키 인터페이스 제공 단말 및 방법
CN102096554A (zh) * 2011-02-16 2011-06-15 南京华设科技有限公司 基于触控式平板电脑的双模视窗操控系统及其操控方法
US20130111391A1 (en) * 2011-11-01 2013-05-02 Microsoft Corporation Adjusting content to avoid occlusion by a virtual input panel

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1841361A (zh) * 2005-03-31 2006-10-04 微软公司 可滚动并可调整大小的公式栏
CN102364424A (zh) * 2011-06-30 2012-02-29 广州市动景计算机科技有限公司 用于定位输入框的方法、装置、浏览器及移动终端

Also Published As

Publication number Publication date
CN104077313A (zh) 2014-10-01
WO2014153986A1 (en) 2014-10-02

Similar Documents

Publication Publication Date Title
CN104077313B (zh) 一种网页页面中多输入框的显示方法、装置及终端设备
CN104360816B (zh) 截屏方法及系统
CN102637198B (zh) 网页内容显示的实现方法、装置、浏览器及移动终端
CN104102419B (zh) 页面显示方法、装置和终端设备
CN104391636B (zh) 一种截屏方法及装置
CN107678724A (zh) 一种信息显示方法、装置、移动终端及存储介质
CN104102418B (zh) 一种移动终端浏览器中输入框目标位置定位方法及装置
CN107728901A (zh) 界面显示方法、装置及终端
US20190114043A1 (en) Method, apparatus, and electronic device for displaying a page and storage medium
CN107765959A (zh) 后台应用程序显示方法和终端
JP2014186541A (ja) 広告生成装置、広告生成プログラム、及び端末装置
CN102012924A (zh) 一种地图显示的方法、系统和移动终端
CN102346650A (zh) 一种新建窗口的方法、装置及触摸屏终端
CN106354404A (zh) 页面操作方法及装置
CN105892794A (zh) 一种浏览器界面显示方法及装置
CN104063155B (zh) 内容分享方法、装置及电子设备
US20130321303A1 (en) Touch detection
CN106843701A (zh) 一种图片轮换展示方法及装置
CN105630468A (zh) Ui框架的焦点移动方法及装置
CN103530026A (zh) 网页弹出框定位方法和装置
CN105094653A (zh) 一种页面内容的定位方法及装置
JP5997328B2 (ja) プログラム及び端末装置
CN104571898A (zh) 页面的显示控制方法及装置
CN103399687A (zh) 一种单点触控窗口显示的执行处理方法
JP5805289B2 (ja) 装置及び配信方法

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
EXSB Decision made by sipo to initiate substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant