CN104142932A - 网页电子表格中子表格边框显示方法 - Google Patents

网页电子表格中子表格边框显示方法 Download PDF

Info

Publication number
CN104142932A
CN104142932A CN201310163226.9A CN201310163226A CN104142932A CN 104142932 A CN104142932 A CN 104142932A CN 201310163226 A CN201310163226 A CN 201310163226A CN 104142932 A CN104142932 A CN 104142932A
Authority
CN
China
Prior art keywords
frame
cell
target
row
sub
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.)
Pending
Application number
CN201310163226.9A
Other languages
English (en)
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.)
SUZHOU JINGYIHUI INFORMATION TECHNOLOGY Co Ltd
Original Assignee
SUZHOU JINGYIHUI INFORMATION TECHNOLOGY 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 SUZHOU JINGYIHUI INFORMATION TECHNOLOGY Co Ltd filed Critical SUZHOU JINGYIHUI INFORMATION TECHNOLOGY Co Ltd
Priority to CN201310163226.9A priority Critical patent/CN104142932A/zh
Publication of CN104142932A publication Critical patent/CN104142932A/zh
Pending legal-status Critical Current

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/166—Editing, e.g. inserting or deleting
    • G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/166—Editing, e.g. inserting or deleting
    • G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
    • G06F40/18—Editing, e.g. inserting or deleting of tables; using ruled lines of spreadsheets

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Radiation-Therapy Devices (AREA)

Abstract

本发明提出了网页电子表格中子表格边框显示方法，该方法包括以下步骤：S1.确定目标子表格；S2.将目标子表格中单元格信息标记或存储；S3.根据单元格信息，确定要添加边框的目标边框；S4.选择或设置目标边框样式；S5.响应边框样式操作事件，显示目标边框，即目标子表格边框。本发明方法灵活，易于实现，克服了html技术现有标签在目标子表格相邻单元格有合并时可能出现表格边框显示多出的缺陷，快速确定目标子表格中各个单元格要显示的边框，对目标子表格相邻单元格有无合并的情况都可以实现正确显示边框；另外单元格边框之间无空隙，显示清晰。

Description

网页电子表格中子表格边框显示方法
技术领域
本发明涉及网页电子表格，特别涉及网页电子表格中子表格边框显示方法。
背景技术
电子表格是由一个或一个以上的行和一个或一个以上的列所构成。其中任意行与任意列相互交叉构成电子表格的一个个单元格。网页电子表格的出现，为用户在线办公提供了可能，用户通过网络浏览器，可以随时随地访问并编辑电子表格。
利用html技术现有标签实现网页电子表格的方式为：先对整个电子表格进行边框初始化，确定目标子表格，对所选表格添加边框。在目标子表格周边不存在合并单元格的情况下，这种方式不会有任何问题，但是如果目标子表格周边存在合并单元的情况，极有可能出现边框显示不正确的情况，如图1所示，紧邻目标子表格的顶部有单元格合并，且列号大于目标子表格的列号，在对目标子表格添加边框时，顶部边框显示就多出一条线；另外在添加边框时，如果和相邻边框的距离过大，则会出现双重边框的情况，影响用户体验。
发明内容
针对html技术现有标签在实现网页电子表格方面存在的问题，本发明提出了网页电子表格中子表格边框显示方法，确定要加边框的目标子表格，将目标子表格中单元格信息标记或存储，然后根据存储信息对目标边框添加样式。为实现上述发明内容，将电子表格边框初始化，初始化后显示出具有行和列的整个电子表格，预览时电子表格边框不显示。本发明采用了如下技术方案：
S1.确定目标子表格；
S2.将目标子表格中单元格信息标记或存储；
S3.根据单元格信息，确定要添加边框的目标边框；
S4.选择或设置目标边框样式；
S5.响应边框样式操作事件，显示目标边框，即目标子表格边框。
进一步，所述单元格信息主要指单元格的位置信息和单元格合并信息。
进一步，步骤S3中对于多行多列形式子表格的目标边框确定方法为：
如果是子表格首行，则选定第一个单元格的左侧边框、顶部边框，该行中间其他单元格的顶部边框，以及最后一个单元格的顶部边框、右侧边框；
如果是子表格中间行，则选定第一个单元格的左侧边框和最后一个单元格的右侧边框；
如果是子表格最后一行，则选定第一个单元格左侧边框、底部边框，该行中间其他单元格的底部边框，以及最后一个单元格的底部边框、右侧边框。
进一步，步骤S3中对于一行多列形式子表格的目标边框确定方法为：
如果是该行第一个单元格，则选定左侧边框、顶部边框、底部边框；
如果是该行中间单元格，则选定顶部边框、底部边框；
如果是该行最后一个单元格，则选定顶部边框、右侧边框、底部边框。
进一步，步骤S3中对于多行一列形式子表格的目标边框确定方法为：
如果是该列第一行单元格，则选定左侧边框、顶部边框、右侧边框；
如果是该列中间单元格，则选定左侧边框、右侧边框；
如果是该列最后一行单元格，则选定左侧边框、底部边框、右侧边框。
进一步，步骤S3中对于单个单元格形式子表格的目标边框确定方法为：选定该单元格的左侧边框、右侧边框、顶部边框、底部边框。
进一步，目标子表格中单元格的cellspacing标签属性值为0。目标子表格与外面相邻单元格边框显示重合情况下仍有清晰的视觉效果。
进一步，所述目标边框的边框显示样式为至少一种。
进一步，所述步骤2中单元格信息的存储方式主要采用二维数组，另外，也可以采用字符串方式存储，还可以采用文件的方式存储。
本发明方法灵活，易于实现，克服了html技术现有标签在目标子表格相邻单元格有合并时可能出现表格边框显示多出的缺陷，快速确定目标子表格中各个单元格要显示的边框，对目标子表格相邻单元格有无合并的情况都可以实现正确显示边框；另外单元格边框之间无空隙，显示清晰。
附图说明
图1为Html现有标签制成表格的显示效果示意图；
图2为本发明所提供的网页电子表格中子表格边框显示方法的流程图；
图3为本发明所提供的网页电子表格中子表格边框显示方法的实施例一的流程图；
图4为本发明所提供的网页电子表格中子表格边框显示方法的实施例二的流程图；
图5为本发明所提供的多行多列形式子表格的目标边框确定方法的效果图；
图6为本发明所提供的一行多列形式子表格的目标边框确定方法的效果图；
图7为本发明所提供的多行一列形式子表格的目标边框确定方法的效果图。
具体实施方式
为了使本发明所提到的网页电子表格中子表格边框显示方法及其优点更加清楚明确，以下参照附图对本发明进行更进一步的详细说明。
图2为本发明所提供的网页电子表格中子表格边框显示方法的流程图，如图所示，该方法包括以下步骤：
步骤S1，确定目标子表格。
用户根据需求，确定要使用的电子表格区域，本发明中称此区域为目标子表格，其中，目标子表的形式可以是多行多列、一行多列、多行一列、单个单元格。
步骤S2，将目标子表格中单元格信息标记或存储。
事先定义可以记录单元格信息的标记，或者定义存放单元格信息的数组，或者可以存放单元格信息的字符串或文件。单元格信息主要包括单元格位于目标子表格的哪行哪列的位置信息和单元格是否存在合并的合并信息。
步骤S3，根据单元格信息，确定要添加边框的目标边框。
根据步骤S2中的单元格位置信息和合并信息，确定所有目标边框。
步骤S4，选择或设置目标边框样式。
目标子表格的边框样式可以是事先设计好供用户选择，也可以是用户根据自己的使用需求自己设置。
步骤S5，响应边框样式操作事件，显示目标边框，即目标子表格边框。
响应用户的边框样式操作的鼠标和/或键盘事件，或者其他触摸工具的操作事件，在网页电子表格中显示出目标子表格的边框。
进一步，为使得显示效果更优，单元格之间的空白设置为0，即在table标签中预先设定cellspacing标签的属性值，“cellspacing＝0”。
实施例一：
图3为本发明所提供的网页电子表格中子表格边框显示方法的实施例一的流程图，如图所示，该方法包括以下步骤：
步骤301，确定目标子表格。
用户根据需求，确定要使用的电子表格区域，本发明中称此区域为目标子表格，其中，目标子表的形式可以是多行多列、一行多列、多行一列、单个单元格。
步骤302，将目标子表格中单元格信息按顺序读入数组A。
定义数组A存放单元格的信息，主要包括单元格在目标子表格中的位置和单元格合并的信息，接着按照相应的顺序读入数组A。
步骤303，调用数组A，根据单元格信息，确定要添加边框的目标边框。
调用数组A，循环数组，获取单元格的信息，根据单元格的行列值及合并情况确定相应的目标边框，目标边框组成目标子表格的边框。
步骤304，选择目标边框样式。
在目标边框样式种类较多的情况下，用鼠标或键盘或其他方式选择目标边框的样式，因目标子表格的边框由多于一个的目标边框组成，可以选择至少一种样式。
步骤305，响应边框样式操作事件，显示目标边框，即目标子表格边框。
响应步骤304中的边框样式操作事件，显示出对应的目标边框。
实施例二：
图4为本发明所提供的网页电子表格中子表格边框显示方法的实施例二的流程图，如图所示，该方法包括以下步骤：
步骤401，确定目标子表格。
用户根据需求，确定要使用的电子表格区域，本发明中称此区域为目标子表格，其中，目标子表的形式可以是多行多列、一行多列、多行一列、单个单元格。
步骤402，在td标签中标记目标子表格中对应单元格信息。
在Html语言实现目标子表格边框的过程中，直接在td标签下标记其对应的单元格的信息，主要包括单元格在目标子表格中的位置和单元格合并的信息。
步骤403，根据标记的单元格信息，确定要添加边框的目标边框。
根据标记的单元格信息，分析和判断，确定哪些单元格的哪个边框属于目标子表格的边框。
步骤404，设置目标边框样式。
在没有边框样式或者已有边框样式都不合适的情况下，设置个性化的边框样式，包括设置边框线条的颜色或粗细或线条构成等。
步骤405，响应边框样式操作事件，显示目标边框，即目标子表格边框。
响应步骤404中的边框样式操作事件，显示出对应的目标边框。
对于实施例一和实施例二中步骤结合使用的情况，本技术领域的人员可以理解，亦在本发明的保护范围之内。
图5为本发明所提供的多行多列形式子表格的目标边框确定方法的效果图，如图所示，该多行多列的子表格为8行4列，表格中既存在行合并又存在列合并，同时第一行相邻右上方单元格又存在列合并的情况。采用本发明所述的边框显示方法，该表格的单元格边框正确显示，目标边框相邻单元格合并没有对边框显示造成影响。
图6为本发明所提供的一行多列形式子表格的目标边框确定方法的效果图，如图所示，该表格为1行4列，表格中存在列合并的情况，同时第一个单元格相邻左上方单元格存在列合并的情况。采用本发明所述的边框显示方法，该表格的单元格边框正确显示，目标边框相邻单元格合并没有对边框显示造成影响。
图7为本发明所提供的多行一列形式子表格的目标边框确定方法的效果图，如图所示，该表格为6行1列，表格中第一个、第二个单元格相邻右上方单元格存在行合并的情况。采用本发明所述的边框显示方法，该表格的单元格边框正确显示，目标边框相邻单元格合并没有对边框显示造成影响。
以上所述是对本发明的较佳的具体实施方式，本技术领域人员应当理解，所述实施方式并非限定本发明的保护范围。在不脱离本发明的精神实质和原则下，在细节方面可以进行变化或者修改，均应涵盖在本发明的权利要求范围之内。

Claims (9)

1.网页电子表格中子表格边框显示方法，将电子表格边框初始化，其特征在于，该方法包括以下步骤：
S1.确定目标子表格；
S2.将目标子表格中单元格信息标记或存储；
S3.根据单元格信息，确定要添加边框的目标边框；
S4.选择或设置目标边框样式；
S5.响应边框样式操作事件，显示目标边框，即目标子表格边框。
2.如权利要求1所述的方法，其特征在于，所述单元格信息主要指单元格的位置信息和单元格合并信息。
3.如权利要求1所述的方法，其特征在于，所述步骤S3中对于多行多列形式子表格的目标边框确定方法为：
如果是子表格首行，则选定第一个单元格的左侧边框、顶部边框，该行中间其他单元格的顶部边框，以及最后一个单元格的顶部边框、右侧边框；
如果是子表格中间行，则选定第一个单元格的左侧边框和最后一个单元格的右侧边框；
如果是子表格最后一行，则选定第一个单元格左侧边框、底部边框，该行中间其他单元格的底部边框，以及最后一个单元格的底部边框、右侧边框。
4.如权利要求1所述的方法，其特征在于，所述步骤S3中对于一行多列形式子表格的目标边框确定方法为：
如果是该行第一个单元格，则选定左侧边框、顶部边框、底部边框；
如果是该行中间单元格，则选定顶部边框、底部边框；
如果是该行最后一个单元格，则选定顶部边框、右侧边框、底部边框。
5.如权利要求1所述的方法，其特征在于，所述步骤S3中对于多行一列形式子表格的目标边框确定方法为：
如果是该列第一行单元格，则选定左侧边框、顶部边框、右侧边框；
如果是该列中间单元格，则选定左侧边框、右侧边框；
如果是该列最后一行单元格，则选定左侧边框、底部边框、右侧边框。
6.如权利要求1所述的方法，其特征在于，所述步骤S3中对于单个单元格形式子表格的目标边框确定方法为：选定该单元格的左侧边框、右侧边框、顶部边框、底部边框。
7.如权利要求1至6任意一项所述的方法，其特征在于，目标子表格中单元格的cellspacing标签属性值为0。
8.如权利要求1至6任意一项所述的方法，其特征在于，目标边框的边框显示样式至少为一种。
9.如权利要求1所述的方法，其特征在于，所述步骤2中单元格信息的存储方式主要采用二维数组。
CN201310163226.9A 2013-05-07 2013-05-07 网页电子表格中子表格边框显示方法 Pending CN104142932A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201310163226.9A CN104142932A (zh) 2013-05-07 2013-05-07 网页电子表格中子表格边框显示方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201310163226.9A CN104142932A (zh) 2013-05-07 2013-05-07 网页电子表格中子表格边框显示方法

Publications (1)

Publication Number Publication Date
CN104142932A true CN104142932A (zh) 2014-11-12

Family

ID=51852106

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201310163226.9A Pending CN104142932A (zh) 2013-05-07 2013-05-07 网页电子表格中子表格边框显示方法

Country Status (1)

Country Link
CN (1) CN104142932A (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109213978A (zh) * 2017-07-03 2019-01-15 珠海金山办公软件有限公司 一种合并单元格的方法、装置、电子设备及可读存储介质
CN111290752A (zh) * 2019-12-24 2020-06-16 浙江明度智控科技有限公司 一种web表格的边框处理方法和装置
CN111353272A (zh) * 2019-12-24 2020-06-30 浙江明度智控科技有限公司 一种web表格的信息显示方法和装置
CN111859874A (zh) * 2019-04-17 2020-10-30 百度在线网络技术（北京）有限公司 表格生成方法及其系统、视频播放设备和计算机可读介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6088708A (en) * 1997-01-31 2000-07-11 Microsoft Corporation System and method for creating an online table from a layout of objects
CN101303693A (zh) * 2008-06-20 2008-11-12 中山大学 一种场景描述文件到html的转换方法
CN102402591A (zh) * 2011-11-01 2012-04-04 深圳市信游天下网络科技有限公司 一种用于网页制作的数据库系统
CN102467378A (zh) * 2010-11-11 2012-05-23 深圳市金蝶友商电子商务服务有限公司 基于二维矩阵的html表格处理方法及计算机

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6088708A (en) * 1997-01-31 2000-07-11 Microsoft Corporation System and method for creating an online table from a layout of objects
CN101303693A (zh) * 2008-06-20 2008-11-12 中山大学 一种场景描述文件到html的转换方法
CN102467378A (zh) * 2010-11-11 2012-05-23 深圳市金蝶友商电子商务服务有限公司 基于二维矩阵的html表格处理方法及计算机
CN102402591A (zh) * 2011-11-01 2012-04-04 深圳市信游天下网络科技有限公司 一种用于网页制作的数据库系统

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109213978A (zh) * 2017-07-03 2019-01-15 珠海金山办公软件有限公司 一种合并单元格的方法、装置、电子设备及可读存储介质
CN111859874A (zh) * 2019-04-17 2020-10-30 百度在线网络技术（北京）有限公司 表格生成方法及其系统、视频播放设备和计算机可读介质
CN111290752A (zh) * 2019-12-24 2020-06-16 浙江明度智控科技有限公司 一种web表格的边框处理方法和装置
CN111353272A (zh) * 2019-12-24 2020-06-30 浙江明度智控科技有限公司 一种web表格的信息显示方法和装置
CN111353272B (zh) * 2019-12-24 2023-10-20 明度智云(浙江)科技有限公司 一种web表格的信息显示方法和装置
CN111290752B (zh) * 2019-12-24 2024-02-20 明度智云(浙江)科技有限公司 一种web表格的边框处理方法和装置

Similar Documents

Publication Publication Date Title
CN105373567B (zh) 页面生成方法及客户端
CN105740315B (zh) 一种多种屏幕响应式网页布局调整的方法
CN100424700C (zh) 在网页中实现表格局部滚动显示的方法及系统
CN102609256B (zh) 一种基于网页的动态图表生成方法
US9043698B2 (en) Method for users to create and edit web page layouts
CN103339625B (zh) 用于显示数据集的方法
CN102509350B (zh) 一种基于立方体的体育运动赛事信息可视化方法
CN103164401A (zh) 页面表格显示方法
CN104142932A (zh) 网页电子表格中子表格边框显示方法
CN101065723A (zh) 在表格中显示数据的方法
EP1815321A2 (en) A method of displaying data in a table
CN101118493A (zh) 一种在网页浏览器中制作动态网站的方法
US9535584B2 (en) Enhanced visual navigation breadcrumbs
CN103631867B (zh) 网页的显示方法和浏览器
CN106708985B (zh) 多栏网页的布局方法及装置
CN103389968A (zh) 一种富文本显示实现方法及系统
CN110489117A (zh) 一种网页布局方法及装置
CN103942231B (zh) 一种网页的显示方法及电子设备
CN102707945A (zh) 一种Eclipse基于布局模版的表单设计器的实现方法
CN106294301A (zh) 报表生成方法和装置
CN105740377A (zh) 网页模板制作的可视化方法以及网页可视化制作装置
CN106557575A (zh) 一种分行显示多列数据的表格展示方法及其装置
EP2843624A1 (en) Image processing device, image processing device control method, program, and information storage medium
CN107562455A (zh) 一种html中列表自适应布局方法及装置
CN105631008B (zh) 网页的显示方法和系统

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
WD01 Invention patent application deemed withdrawn after publication
WD01 Invention patent application deemed withdrawn after publication

Application publication date: 20141112