CN111176519A - 一种复选框滑动多选的方法 - Google Patents

一种复选框滑动多选的方法 Download PDF

Info

Publication number
CN111176519A
CN111176519A CN201811343500.XA CN201811343500A CN111176519A CN 111176519 A CN111176519 A CN 111176519A CN 201811343500 A CN201811343500 A CN 201811343500A CN 111176519 A CN111176519 A CN 111176519A
Authority
CN
China
Prior art keywords
mouse
selection
sliding
event
index
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
CN201811343500.XA
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.)
Shopex Software Co ltd
Original Assignee
Shopex Software 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 Shopex Software Co ltd filed Critical Shopex Software Co ltd
Priority to CN201811343500.XA priority Critical patent/CN111176519A/zh
Publication of CN111176519A publication Critical patent/CN111176519A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range

Abstract

本发明公开了一种复选框滑动多选的方法,用户在复选框上按下鼠标时触发mouse‑down事件,设置一个变量,标识滑动选择开始;对复选框的父元素同时监听mouse‑out和mouse‑over事件;在Mouse‑out里设置本次滑动选择的类型;在mouse‑over事件里,检测当前滑过元素的索引,循环设置从起始索引到当前索引对应的复选框状态;最后,在最外层的元素监听mouse‑up事件,即当鼠标松开时,标识本次滑动选择结束。本发明无需额外的开发工作量,只需要对复选框相关事件做简单的改进,即可有效提高操作人员的工作效率,提升web应用系统的用户体验。

Description

一种复选框滑动多选的方法
技术领域
本发明属于互联网技术领域,尤其涉及一种复选框滑动多选的方法。
背景技术
随着互联网的普及程度不断提高,基于浏览器的web应用系统越来越多,在 web系统里,复选框作为批量操作数据的选择器,是使用频率较高的web控件。虽然复选框本身技术含量不高,但基于传统的操作方法,用户在批量选择数据时,必须手动逐个选择,整个过程过于繁琐,工作效率较低。
发明内容
为克服现有技术的不足之处,本发明提供一种复选框滑动多选的方法。
本发明是通过以下技术方案实现的:
一种复选框滑动多选的方法,其特征在于,包括如下步骤:
(1)用户在复选框上按下鼠标时触发mouse-down事件,设置一个变量,标识滑动选择开始;
(2)对复选框的父元素同时监听mouse-out和mouse-over事件;
(3)在Mouse-out里设置本次滑动选择的类型,如果初始元素是选中状态,则滑动选择的元素均选中;如果初始元素是未选中状态,则滑动选择的元素均取消选中;
(4)在mouse-over事件里,检测当前滑过元素的索引,循环设置从起始索引到当前索引对应的复选框状态;最后,在最外层的元素监听mouse-up事件,即当鼠标松开时,标识本次滑动选择结束。
本发明的有益效果是:本发明提供的复选框滑动多选的方法,无需额外的开发工作量,只需要对复选框相关事件做简单的改进,即可有效提高操作人员的工作效率,提升web应用系统的用户体验。
附图说明
结合附图,并通过参考下面的详细描述,将会更容易地对本发明有更完整的理解并且更容易地理解其伴随的优点和特征,其中:
图1是本发明的原理示意图。
具体实施方式
下面将结合具体实施例来详细说明本发明,在此本发明的示意性实施例以及说明用来解释本发明,但并不作为对本发明的限定。
如图1所示,一种复选框滑动多选的方法,包括如下步骤:
(1)用户在复选框上按下鼠标时触发mouse-down事件,设置一个变量,标识滑动选择开始;
(2)对复选框的父元素同时监听mouse-out和mouse-over事件;
(3)在Mouse-out里设置本次滑动选择的类型,如果初始元素是选中状态,则滑动选择的元素均选中;如果初始元素是未选中状态,则滑动选择的元素均取消选中;
(4)在mouse-over事件里,检测当前滑过元素的索引,循环设置从起始索引到当前索引对应的复选框状态;最后,在最外层的元素监听mouse-up事件,即当鼠标松开时,标识本次滑动选择结束。
具体的,本实施例中,用户鼠标点击复选框,触发mouse-down,滑动选择开始batch_select_mode=true。
移动鼠标时,触发mouse-out,记录初始选择状态batch_select_value=true 和初始索引batch_select_firstidx=i。
滑动鼠标,记录鼠标所在位置的索引值batch_select_lastidx=j。
循环设置从初始索引(i)到当前索引(j)之间所有的复选框,将状态设置为初始选择状态(batch_select_value)。
松开鼠标,触发mouse-up,滑动选择结束batch_select_mode=false。
onMouseup事件定义:
Figure BDA0001863180830000021
Figure BDA0001863180830000031
onMouseDown事件定义:
Figure BDA0001863180830000032
onMouseOut事件定义:
Figure BDA0001863180830000033
Figure BDA0001863180830000041
综上所述,本发明无需额外的开发工作量,只需要对复选框相关事件做简单的改进,即可有效提高操作人员的工作效率,提升web应用系统的用户体验。

Claims (4)

1.一种复选框滑动多选的方法,其特征在于,包括如下步骤:
(1)用户在复选框上按下鼠标时触发mouse-down事件,设置一个变量,标识滑动选择开始;
(2)对复选框的父元素同时监听mouse-out和mouse-over事件;
(3)在Mouse-out里设置本次滑动选择的类型,如果初始元素是选中状态,则滑动选择的元素均选中;如果初始元素是未选中状态,则滑动选择的元素均取消选中;
(4)在mouse-over事件里,检测当前滑过元素的索引,循环设置从起始索引到当前索引对应的复选框状态;最后,在最外层的元素监听mouse-up事件,即当鼠标松开时,标识本次滑动选择结束。
2.如权利要求1所述的复选框滑动多选的方法,其特征在于,所述步骤(2)中当移动鼠标时,触发mouse-out,记录初始选择状态和初始索引。
3.如权利要求1所述的复选框滑动多选的方法,其特征在于,所述步骤(3)中滑动鼠标,记录鼠标所在位置的索引值。
4.如权利要求1所述的复选框滑动多选的方法,其特征在于,所述步骤(4)中循环设置从初始索引到当前索引之间所有的复选框,将状态设置为初始选择状态。
CN201811343500.XA 2018-11-13 2018-11-13 一种复选框滑动多选的方法 Pending CN111176519A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201811343500.XA CN111176519A (zh) 2018-11-13 2018-11-13 一种复选框滑动多选的方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201811343500.XA CN111176519A (zh) 2018-11-13 2018-11-13 一种复选框滑动多选的方法

Publications (1)

Publication Number Publication Date
CN111176519A true CN111176519A (zh) 2020-05-19

Family

ID=70657107

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201811343500.XA Pending CN111176519A (zh) 2018-11-13 2018-11-13 一种复选框滑动多选的方法

Country Status (1)

Country Link
CN (1) CN111176519A (zh)

Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1851631A (zh) * 2005-12-27 2006-10-25 华为技术有限公司 树中单个节点的事件处理方法
CN1924865A (zh) * 2005-09-02 2007-03-07 奥林巴斯映像株式会社 信息编档设备和信息编档方法
CN101063924A (zh) * 2006-04-30 2007-10-31 国际商业机器公司 使用户能够在一个文档中选择多个对象的方法及装置
CN102262507A (zh) * 2011-06-28 2011-11-30 中兴通讯股份有限公司 一种利用多点触控实现对象批量选择的方法和装置
CN102662555A (zh) * 2012-03-06 2012-09-12 华为终端有限公司 一种终端复选操作方法和终端
CN102760029A (zh) * 2011-04-29 2012-10-31 汉王科技股份有限公司 在显示界面上操作列表的方法和装置
CN103853455A (zh) * 2012-11-30 2014-06-11 金蝶软件(中国)有限公司 一种选择对象的方法及装置
CN104777992A (zh) * 2014-01-09 2015-07-15 中兴通讯股份有限公司 一种触摸屏下实现快速批量操作的方法及装置
US20160259511A1 (en) * 2010-11-23 2016-09-08 Levels Beyond Dynamic synchronization tool
CN106020627A (zh) * 2016-05-20 2016-10-12 乐视控股(北京)有限公司 一种对列表项进行多选的方法和装置

Patent Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1924865A (zh) * 2005-09-02 2007-03-07 奥林巴斯映像株式会社 信息编档设备和信息编档方法
CN1851631A (zh) * 2005-12-27 2006-10-25 华为技术有限公司 树中单个节点的事件处理方法
CN101063924A (zh) * 2006-04-30 2007-10-31 国际商业机器公司 使用户能够在一个文档中选择多个对象的方法及装置
US20160259511A1 (en) * 2010-11-23 2016-09-08 Levels Beyond Dynamic synchronization tool
CN102760029A (zh) * 2011-04-29 2012-10-31 汉王科技股份有限公司 在显示界面上操作列表的方法和装置
CN102262507A (zh) * 2011-06-28 2011-11-30 中兴通讯股份有限公司 一种利用多点触控实现对象批量选择的方法和装置
CN102662555A (zh) * 2012-03-06 2012-09-12 华为终端有限公司 一种终端复选操作方法和终端
CN103853455A (zh) * 2012-11-30 2014-06-11 金蝶软件(中国)有限公司 一种选择对象的方法及装置
CN104777992A (zh) * 2014-01-09 2015-07-15 中兴通讯股份有限公司 一种触摸屏下实现快速批量操作的方法及装置
CN106020627A (zh) * 2016-05-20 2016-10-12 乐视控股(北京)有限公司 一种对列表项进行多选的方法和装置

Similar Documents

Publication Publication Date Title
US11481408B2 (en) Event driven extract, transform, load (ETL) processing
US9836346B2 (en) Error troubleshooting using a correlated knowledge base
US8312037B1 (en) Dynamic tree determination for data processing
US8812546B1 (en) State management for user interfaces
CN110968309B (zh) 一种模板生成方法、装置、电子设备及存储介质
CN103412924B (zh) 日志多语言查询方法和系统
CN105138312B (zh) 一种表格生成方法及装置
US11250066B2 (en) Method for processing information, electronic device and storage medium
WO2018103532A1 (zh) 一种无埋点部署监测方法及相关装置
CN104268241B (zh) 一种配置数据库中属性显示方法
JP6542880B2 (ja) データソースからデータターゲットにデータを転送するためのインポート手順の呼出しの単純化
US10175954B2 (en) Method of processing big data, including arranging icons in a workflow GUI by a user, checking process availability and syntax, converting the workflow into execution code, monitoring the workflow, and displaying associated information
CN111222571B (zh) 图像特效的处理方法、装置、电子设备及存储介质
Kondekar et al. Image retrieval techniques based on image features: a state of art approach for cbir
CN108334619A (zh) 一种数据采集方法、装置、计算设备及存储介质
CN105550179A (zh) 一种网页收藏方法和浏览器插件
CN103713901A (zh) 单据的展示方法和系统
CN111176519A (zh) 一种复选框滑动多选的方法
US9977726B2 (en) System and method for smart framework for network backup software debugging
CN107330031A (zh) 一种数据存储的方法、装置及电子设备
CN104462521B (zh) 订阅卡片关联信息的搜索方法
WO2016173136A1 (zh) 一种终端应用处理方法及其装置
US20210042271A1 (en) Distributed garbage collection for dedupe file system in cloud storage bucket
CN112162964B (zh) 一种自适应数据同步方法、装置、计算机设备及存储介质
CN116881001B (zh) 多dpu宿主机的云平台的管控方法、装置、设备及介质

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20200519