CN111381689A - 一种小程序的输入方法、装置、电子设备及存储介质 - Google Patents
一种小程序的输入方法、装置、电子设备及存储介质 Download PDFInfo
- Publication number
- CN111381689A CN111381689A CN202010171934.7A CN202010171934A CN111381689A CN 111381689 A CN111381689 A CN 111381689A CN 202010171934 A CN202010171934 A CN 202010171934A CN 111381689 A CN111381689 A CN 111381689A
- Authority
- CN
- China
- Prior art keywords
- input
- target
- list item
- matching result
- variable
- 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
Links
- 238000000034 method Methods 0.000 title claims abstract description 39
- 238000009877 rendering Methods 0.000 claims abstract description 14
- 230000001960 triggered effect Effects 0.000 claims description 13
- 238000004590 computer program Methods 0.000 claims description 10
- 238000004806 packaging method and process Methods 0.000 claims description 7
- 230000006870 function Effects 0.000 description 66
- 238000010586 diagram Methods 0.000 description 8
- 230000003287 optical effect Effects 0.000 description 4
- 238000012545 processing Methods 0.000 description 4
- 238000004891 communication Methods 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 241001436679 Adama Species 0.000 description 2
- 230000000644 propagated effect Effects 0.000 description 2
- 230000006978 adaptation Effects 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000005587 bubbling Effects 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 238000012905 input function Methods 0.000 description 1
- 238000009434 installation Methods 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 230000000284 resting effect Effects 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/02—Input arrangements using manually operated switches, e.g. using keyboards or dials
- G06F3/023—Arrangements for converting discrete items of information into a coded form, e.g. arrangements for interpreting keyboard generated codes as alphanumeric codes, operand codes or instruction codes
- G06F3/0233—Character input methods
- G06F3/0237—Character input methods using prediction or retrieval techniques
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/903—Querying
- G06F16/90335—Query processing
- G06F16/90344—Query processing by using string matching techniques
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Human Computer Interaction (AREA)
- Computational Linguistics (AREA)
- Data Mining & Analysis (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本公开实施例提供了一种小程序的输入方法、装置、电子设备及存储介质，其中，该方法包括：当监测到在输入框的输入事件时，通过输入框绑定的回调函数确定用户输入的字符；通过回调函数将字符与数据库进行匹配，得到与字符相关的匹配结果；将匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；当监测到触发目标列表项时，通过目标列表项绑定的回调函数确定目标列表项的索引，根据索引从列表变量中确定对应的目标匹配结果；将目标匹配结果存放到作为空字符串的输入框变量中，将输入框变量中的目标匹配结果设置为目标列表项对应的内容，可以提高在小程序中的输入效率。
Description
技术领域
本公开实施例涉及计算机技术，尤其涉及一种小程序的输入方法、装置、设备及存储介质。
背景技术
小程序是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想。随着计算机技术的发展，小程序的规模越来越大，对小程序的交互需求也越来越高。
相关技术中，当用户通过小程序进行输入时，用户需要依次将每个字符一一输入。当用户每输入一个字符时，与该字符相关的内容并不能进行提示以辅助用户输入字符，因此，降低用户的输入效率。
发明内容
本公开实施例提供实施例提供了一种小程序的输入方法，可以提高用户输入字符的效率。
第一方面，本公开实施例提供了一种小程序的输入方法，包括：
当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
第二方面，本公开实施例提供了一种小程序的输入装置，包括：
第一确定模块，用于当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
匹配结果得到模块，用于通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
渲染/展示，用于将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
第二确定模块，用于当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
设置模块，用于将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
第三方面，本公开实施例提供的一种电子设备，包括：
一个或多个处理器；
存储装置，用于存储一个或多个程序，
当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本公开实施例提供的一种小程序的输入方法。
第四方面，本公开实施例提供的一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本公开实施例提供的一种小程序的输入方法。
本公开实施例提供的技术方案，小程序中通过回调函数确定用户输入的字符，并通过回调函数将字符与数据库匹配得到与字符相关的匹配结果，通过将所述匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示，可以实现将与字符相关的内容进行展示，以供用户进行选择，用户可以根据需要选择展示的与字符相关的内容；当监测到触发目标列表项时，小程序通过回调函数确定目标列表项的索引，根据索引从列表变量中确定对应的目标匹配结果，并通过所述目标匹配结果存放到作为空字符串的输入框变量中，将输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，可以实现目标列表项对应内容的输入，上述的输入方法，可以优化小程序的内部算法，并且可以根据用户的触发操作展示对应的内容，即将根据用户的触发操作可以将与字符相关的内容显示在输入框中，可以提高输入效率。
附图说明
图1是本公开实施例提供的一种小程序的输入方法流程图；
图2a是本公开实施例提供的一种小程序的输入方法流程图；
图2b是本公开实施例提供的一种小程序的输入方法流程图；
图3是本公开实施例提供的一种小程序的输入装置的结构框图；
图4是本公开提供的一种电子设备的结构示意图。
具体实施方式
下面结合附图和实施例对本公开作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本公开，而非对本公开的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本公开相关的部分而非全部结构。
图1为本公开实施例提供的一种小程序的输入方法流程图，所述方法由小程序的输入装置来执行，所述装置由软件和/或硬件来执行。所述装置可以配置在小程序中，所述小程序可以是具有输入功能的小程序，可选的，所述小程序可以是具有搜索功能的小程序。所述小程序可以配置在智能手机、平板电脑等电子设备中。可选的，本公开实施例提供的方法可以应用于通过小程序进行输入字符的场景中。
如图1所示，本公开实施例提供的技术方案包括：
S110：当监测到在输入框的输入事件时，通过回调函数确定用户输入的字符。
在本公开实施例中，当用户通过小程序的输入框输入字符时，小程序可以监测到在输入框的输入事件。具体的，当监测到在输入框的输入事件时，可以将输入的字符包装成事件对象，通过与输入框绑定的回调函数对事件对象进行解析，确定用户输入的字符。其中，回调函数就是一个通过函数指针调用的函数，回调函数可以是bindinput的回调函数。
S120：通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果。
在本公开实施例中，数据库可以是服务器中的数据库，可以是本地的数据库。其中，当数据库是服务器中的数据库时，通过回调函数向服务器发送与字符匹配的请求，从而得到匹配结果。当数据库是本地的数据库时，通过回调函数将字符与本地的数据库进行匹配，得到与字符相关的匹配结果。
在本公开实施例中，得到与字符相关的匹配结果的匹配模式可以是多种模式。其中，与字符相关的匹配结果可以是包含该字符，且该字符为第一个字符的词组。或者当用户输入两个字符时，与字符相关的匹配结果可以是包含该两个字符，且所述两个字符为前两个字符的词组。例如，本地数据库中存在一个结果数组，结果数组里存放着adama，adan，asian，apple，abort。当用户输入a时，遍历结果数组的每一项，将a匹配该项的第一个字母是否相等，如果相等，则匹配成功，结果返回数组所有。当用户输入ap，遍历结果数组的每一项，将ap匹配该项的前两个字母，如果相等，则匹配成功，结果返回apple。该匹配模式即为：匹配结果前面的具有与输入字符长度相同的字符，是否与输入字符相等。
S130：将所述匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示。
在本公开实施例中，列表变量(变量relativeList)是预先创建的变量，可以作为空数组，用于存储字符相关的匹配结果。
在本公开实施例中，基于列表变量中的平匹配结果渲染列表项可以具体是：小程序将列表变量中的匹配结果填充到列表模板中，并进行渲染得到列表项。其中，列表项可以是至少一项；当列表渲染时，小程序在组件上使用wx:for控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该项，默认数组的当前项的下标变量名默认为index，数组当前项的变量名默认item。
S140：当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果。
在本公开实施例中，预先为列表变量中的每一项绑定回调函数。当监测到触发目标列表项时，通过目标列表项绑定的回调函数确定目标列表项的索引。具体的，目标列表项绑定的回调函数传入的event对象的currentTarget属性对应的值，该值为一个对象，该对象的currentTarget属性对应的值为一个对象，该对象的index属性对应的值作为目标列表项的索引。其中，该index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。其中，根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值为目标列表项的索引。在执行本发明实施例的方法之前，可以将每个列表项的索引预先设置，将根据列表变量中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引。
S150：将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
在本公开实施例中，输入框变量(inputData变量)是预先创建的变量，用于显示输入框的内容。其中，当将输入框变量中的目标匹配结果设置为目标列表项对应的内容时，该目标列表项对应的内容显示在输入框中，从而可以完成自动补全。
相关技术中，当用户通过小程序进行输入时，用户需要依次将每个字符一一输入。当用户输入字符时，自动提示用户正在输入的字符相关的内容，然后用户点击提示的内容就自动完成输入，该输入的方法在小程序还不能应用，小程序并不具有上述的功能，因此用户通过小程序进行输入时，效率较低。
本公开实施例提供的技术方案，小程序中通过回调函数确定用户输入的字符，并通过回调函数将字符与数据库匹配得到与字符相关的匹配结果，通过将所述匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示，可以实现将与字符相关的内容进行展示，以供用户进行选择，用户可以根据需要选择展示的与字符相关的内容；当监测到触发目标列表项时，小程序通过回调函数确定目标列表项的索引，根据索引从列表变量中确定对应的目标匹配结果，并通过所述目标匹配结果存放到作为空字符串的输入框变量中，将输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，可以实现目标列表项对应内容的输入，上述的输入方法，可以优化小程序的内部算法，并且可以根据用户的触发操作展示对应的内容，即将根据用户的触发操作可以将与字符相关的内容显示在输入框中，可以提高输入效率。
图2a是本公开实施例提供的一种小程序的输入方法流程图，本实施例中的方案可以与上述实施例中的一个或者多个可选方案组合。本实施例中，可选的，
本公开实施例提供的方法还可以包括：基于输入框标签显示输入框，其中，所述输入框标签的value属性值为所述输入框变量中的值。
可选的，当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符，包括：
当监测到在输入框的输入事件时，将输入的字符包装成事件对象；
通过与所述输入框绑定的回调函数对所述事件对象进行解析，确定用户输入的字符。
可选的，所述将渲染的列表项进行展示，包括：
将渲染的列表项在自动提示框中进行展示，其中，所述自动提示框基于自动提示框标签进行显示。
可选的，所述当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，包括：
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数将所述目标列表项包装成目标事件对象；
从所述目标事件对象的属性信息中得到index属性对应的值，将index属性对应的值作为所述目标列表项的索引；其中，index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。
如图2a所示，本公开实施例提供的技术方案包括：
S210：基于输入框标签显示输入框，其中，所述输入框标签的value属性值为所述输入框变量中的值。
在本公开实施例中，在S210之前，还可以包括对输入框和自动提示框进行初始化，具体可以是：
步骤一：创建一个<view>标签，作为自动补全的容器，设置position属性值为relative，该标签的子元素为绝对定位，会按照该元素的左上角作为原点。
步骤二：创建列表变量relativeList，作为空数组，用于储存与字符相关内容的匹配结果，并创建输入框变量inputData，并作为空字符串，用于设置输入框的显示内容。
步骤三：在自动补全容器中再创建输入框标签(<input>标签)，作为输入框，设置value属性值为变量inputData。在自动补全容器中创建自动提示框标签(<view>标签)，作为自动提示框，设置其postion属性值为absolute，这样该元素为绝对定位，其位置由其left属性值和top属性值决定，并且以父元素的左上角为原点。设置其top属性值为<input>标签的高度值，列表会从输入框下部开始显示；设置width属性值为<input>标签的宽度值，列表与输入框等宽。设置display属性为弹性布局(flex)，这样该自动补全容器内部将采用弹性盒子布局，设置其flex-direction属性为column，这样其列表中的列表项将从上往下排布。
步骤四：在自动提示框标签中，通过小程序列表循环，根据变量relativeList中的每一项匹配结果，渲染出一个标签，将该标签的data-index属性设置为当前对应的列表项的索引。即在自动提示框标签中，将根据列表变量(变量relativeList)中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引，从而完成对列表项索引的设置。并且为每一项匹配结果，绑定bindinput回调函数，这样在用户点击列表项时，会触发该回调函数，从而通过bindinput回调函数确定索引，并根据索引确定对应的匹配结果。
步骤五：为输入框标签设置bindinput回调函数。(用户每次输入或者删除一个字符，会触发该回调函数，完成对输入或者删除字符的确定)
在本公开实施例中，当完成上述的设置之后，用户打开小程序，小程序可以基于输入框标签显示输入框。具体的，可以根据输入框标签设置的高度、宽度、位置等属性信息在屏幕上显示输入框，以使用户在输入框中输入字符。
S220：当监测到在输入框的输入事件时，将输入的字符包装成事件对象。
S230：通过与所述输入框绑定的回调函数对所述事件对象进行解析，确定用户输入的字符。
在本公开实施例中，具体的，可以通过事件对象进行解析，确定事件对象的detail属性值中的value属性值，通过value属性值确定用户输入的字符。其中，value属性值可以是事件对象的具体内容，由于输入的字符包装成了事件对象，成为事件对象的具体内容，通过value属性值可以得到事件对象的具体内容，即为用户输入的字符。
S240：通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果。
S250：将所述匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，将渲染的列表项在自动提示框中进行展示，其中，所述自动提示框基于自动提示框标签进行显示。
在本公开实施例中，自动提示框标签的位置属性值(position属性值)为绝对的(absolute)；自动提示框标签的top属性值为输入框标签的高度值，从而可以使自动提示框中的列表从输入框下部开始显示。自动提示框标签的width属性值为输入框标签的宽度值，从而可以使自动提示框中的列表与输入框等宽；其中，自动提示框标签的display属性为弹性布局，可以使容纳自动提示框标签的自动提示框容器将采用弹性盒子布局。其中，在自动提示框标签中，将根据列表变量中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引，可以完成列表中列表项索引的设置。
S260：当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数将所述目标列表项包装成目标事件对象。
S270：从所述目标事件对象的属性信息中得到index属性对应的值，将index属性对应的值作为所述目标列表项的索引；其中，index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。
在本公开实施例中，具体的，目标列表项绑定的回调函数传入的event对象的currentTarget属性对应的值，该值为一个对象，该对象的currentTarget属性对应的值为一个对象，该对象的index属性对应的值作为目标列表项的索引。其中，该index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。其中，根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值为目标列表项的索引。在执行本步骤之前，可以将每个列表项的索引可以预先设置，将根据列表变量中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引。
S280：根据所述索引从所述列表变量中确定对应的目标匹配结果。
S290：将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
由此，小程序通过回调函数确定用户输入的字符，并通过回调函数将字符与数据库匹配得到与字符相关的匹配结果，通过将所述匹配结果存放到作为空数组的列表变量中，基于列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示，可以实现将与字符相关的内容进行展示，以供用户进行选择，用户可以根据需要选择展示的与字符相关的内容；当监测到触发目标列表项时，小程序通过回调函数确定目标列表项的索引，根据索引从列表变量中确定对应的目标匹配结果，并通过所述目标匹配结果存放到作为空字符串的输入框变量中，将输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，可以实现目标列表项对应内容的输入，上述的输入方法，可以优化小程序的内部算法，并且可以根据用户的触发操作展示对应的内容，即将根据用户的触发操作可以将与字符相关的内容显示在输入框中，可以提高输入效率。
本公开实施例提供的方法还可以参考图2b。其中，本公开实施例提供的方法可以包括如下流程：
S01：初始化输入框和自动提示框，具体为：
步骤一：创建一个<view>标签，作为自动补全的容器，设置position属性值为relative，该标签的子元素为绝对定位，会按照该元素的左上角作为原点。
步骤二：创建列表变量relativeList，作为空数组，用于储存与字符相关内容的匹配结果，并创建输入框变量inputData，并作为空字符串，用于设置输入框的显示内容。
步骤三：在自动补全容器中再创建输入框标签(<input>标签)，作为输入框，设置value属性值为变量inputData。在自动补全容器中创建自动提示框标签(<view>标签)，作为自动提示框，设置其postion属性值为absolute，这样该元素为绝对定位，其位置由其left属性值和top属性值决定，并且以父元素的左上角为原点。设置其top属性值为<input>标签的高度值，列表会从输入框下部开始显示；设置width属性值为<input>标签的宽度值，列表与输入框等宽。设置display属性为弹性布局(flex)，这样该自动补全容器内部将采用弹性盒子布局，设置其flex-direction属性为column，这样其列表中的列表项将从上往下排布。
步骤四：在自动提示框标签中，通过小程序列表循环，根据变量relativeList中的每一项匹配结果，渲染出一个标签，将该标签的data-index属性设置为当前对应的列表项的索引。即在自动提示框标签中，将根据列表变量(变量relativeList)中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引，从而完成对列表项索引的设置。并且为每一项匹配结果，绑定bindinput回调函数，这样在用户点击列表项时，会触发该回调函数，从而通过bindinput回调函数确定索引，并根据索引确定对应的匹配结果。
步骤五：为输入框标签设置bindinput的回调函数。(用户每次输入或者删除一个字符，会触发该回调函数，完成对输入或者删除字符的确定)
S02：输入时联想并提示补全的内容，具体为：
步骤一：在bindinput回调函数中，通过传来的事件对象的detail属性值的value属性值，获得用户当前正在输入的文字。
步骤二：将文字与数据库相匹配，可以从服务器请求数据，也可以根据本地的数据匹配，而匹配也有很多模式。例如，本地有一个结果数组，数组里存放着adama,adan,asian,apple,abort，当用户输入a时，遍历结果数组的每一项，将a匹配该项的第一个字母是否相等，如果相等，则匹配成功，结果返回数组所有。当用户输入ap，遍历结果数组的每一项，将ap匹配该项的前两个字母，如果相等，则匹配成功，结果返回apple。该匹配模式即为匹配结果中与输入文字具有相同长度的文字相同，且位于在匹配结果的最前面。
步骤三：从步骤二中得到与文字相关的匹配结果，存放到变量relativeList中，然后小程序会根据变量relativeList中的内容，渲染出联想的列表项内容。
S03：点击提示的列表项，实现自动补全，具体是：
在列表项的回调函数中，从回调函数传入的event对象的currentTarget属性对应的值，该值为一个对象，该对象的dataset属性对应的值为一个对象，该对象的index属性对应的值，(与初始化步骤对应的data-index属性对应的值相同)，该值是当前列表项在变量relativeList中的索引，从而得到索引对应的匹配结果，将匹配结果存入到变量inputData中，然后小程序根据变量inputData，将输入框的内容设置为该列表项对应的内容，完成列表项内容的输入，实现自动补全。
通过上述的方法，可以优化小程序的内部算法，可以将与用户输入字符相关的内容显示在输入框中，从而提高输入效率，方便用户，提高用户体验。
其中，本公开实施例中对于事件对象的说明：
如无特殊说明，当组件触发事件时，逻辑层绑定该事件的处理函数会收到一个事件对象。
BaseEvent基础事件对象属性列表如表1：
表1
| 属性 | 类型 | 说明 |
| type | String | 事件类型 |
| timeStamp | Integer | 事件生成时的时间戳 |
| target | Object | 触发事件的组件的一些属性值集合 |
| currentTarget | Object | 当前组件的一些属性值集合 |
CustomEvent自定义事件对象属性列表如表2(继承BaseEvent)：
表2
| 属性 | 类型 | 说明 |
| detail | Object | 额外的信息 |
TouchEvent触摸事件对象属性列表如表3(继承BaseEvent)：
表3
| 属性 | 类型 | 说明 |
| touches | Array | 触摸事件，当前停留在屏幕中的触摸点信息的数组 |
| changedTouches | Array | 触摸事件，当前变化的触摸点信息的数组 |
特殊事件：<canvas/>中的触摸事件不可冒泡，所以没有currentTarget。其中，touches是一个数组，每个元素为一个Touch对象(canvas触摸事件中携带的touches是CanvasTouch数组)。表示当前停留在屏幕上的触摸点。
图3是本公开实施例提供的一种小程序的输入装置结构框图，所述装置应用于小程序，所述装置包括：第一确定模块310、匹配结果得到模块320、渲染/展示330、第二确定模块340和设置模块350。
其中，第一确定模块310，用于当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
匹配结果得到模块320，用于通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
渲染/展示330，用于将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
第二确定模块340，用于当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
设置模块350，用于将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
可选的，第一确定模块310，用于：
当监测到在输入框的输入事件时，将输入的字符包装成事件对象；
通过与所述输入框绑定的回调函数对所述事件对象进行解析，确定用户输入的字符。
可选的，所述装置还包括输入框显示模块，用于基于输入框标签显示输入框，其中，所述输入框标签的value属性值为所述输入框变量中的值。
可选的，所述将渲染的列表项进行展示，包括：
将渲染的列表项在自动提示框中进行展示，其中，所述自动提示框基于自动提示框标签进行显示。
可选的，所述自动提示框标签的位置属性值为绝对的；
所述自动提示框标签的top属性值为所述输入框标签的高度值；
所述自动提示框标签的width属性值为所述输入框标签的宽度值；
所述自动提示框标签的display属性为弹性布局。
可选的，所述设置模块还用于：
在所述自动提示框标签中，将根据列表变量中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引。
可选的，第二确定模块340，用于：
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数将所述目标列表项包装成目标事件对象；
从所述目标事件对象的属性信息中得到index属性对应的值，将index属性对应的值作为所述目标列表项的索引；其中，index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。
上述装置可执行本公开任意实施例所提供的方法，具备执行方法相应的功能模块和有益效果。
下面参考图4，其示出了适于用来实现本公开实施例的电子设备(例如终端设备)400的结构示意图。本公开实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图4示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。
如图4所示，电子设备400可以包括处理装置(例如中央处理器、图形处理器等)401，其可以根据存储在只读存储器(ROM)402中的程序或者从存储装置408加载到随机访问存储器(RAM)403中的程序而执行各种适当的动作和处理。在RAM 403中，还存储有电子设备400操作所需的各种程序和数据。处理装置401、ROM 402以及RAM 403通过总线404彼此相连。输入/输出(I/O)接口405也连接至总线404。
通常，以下装置可以连接至I/O接口405：包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置406；包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置407；包括例如磁带、硬盘等的存储装置408；以及通信装置409。通信装置409可以允许电子设备400与其他设备进行无线或有线通信以交换数据。虽然图4示出了具有各种装置的电子设备400，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置409从网络上被下载和安装，或者从存储装置408被安装，或者从ROM 402被安装。在该计算机程序被处理装置401执行时，执行本公开实施例的方法中限定的上述功能。
需要说明的是，本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：电线、光缆、RF(射频)等等，或者上述的任意合适的组合。
上述计算机可读介质可以是上述电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。
上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：
当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码，上述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图，图示了按照本公开各种实施例的方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。描述于本公开实施例中所涉及到的模块、单元可以通过软件的方式实现，也可以通过硬件的方式来实现。其中，模块、单元的名称在某种情况下并不构成对该模块或单元本身的限定。
以上描述仅为本公开的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解，本公开中所涉及的公开范围，并不限于上述技术特征的特定组合而成的技术方案，同时也应涵盖在不脱离上述公开构思的情况下，由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本公开中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。
注意，上述仅为本公开的较佳实施例及所运用技术原理。本领域技术人员会理解，本公开不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本公开的保护范围。因此，虽然通过以上实施例对本公开进行了较为详细的说明，但是本公开不仅仅限于以上实施例，在不脱离本公开构思的情况下，还可以包括更多其他等效实施例，而本公开的范围由所附的权利要求范围决定。
Claims (10)
1.一种小程序的输入方法，其特征在于，包括：
当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
2.根据权利要求1所述的方法，其特征在于，当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符，包括：
当监测到在输入框的输入事件时，将输入的字符包装成事件对象；
通过与所述输入框绑定的回调函数对所述事件对象进行解析，确定用户输入的字符。
3.根据权利要求1所述的方法，其特征在于，还包括：
基于输入框标签显示输入框，其中，所述输入框标签的value属性值为所述输入框变量中的值。
4.根据权利要求3所述的方法，其特征在于，所述将渲染的列表项进行展示，包括：
将渲染的列表项在自动提示框中进行展示，其中，所述自动提示框基于自动提示框标签进行显示。
5.根据权利要求4所述的方法，其特征在于，
所述自动提示框标签的位置属性值为绝对的；
所述自动提示框标签的top属性值为所述输入框标签的高度值；
所述自动提示框标签的width属性值为所述输入框标签的宽度值；
所述自动提示框标签的display属性为弹性布局。
6.根据权利要求4所述的方法，其特征在于，还包括：
在所述自动提示框标签中，将根据列表变量中匹配结果渲染的标签的data-index属性对应的值设置为匹配结果对应的列表项的索引。
7.根据权利要求6所述的方法，其特征在于，所述当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，包括：
当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数将所述目标列表项包装成目标事件对象；
从所述目标事件对象的属性信息中得到index属性对应的值，将index属性对应的值作为所述目标列表项的索引；其中，index属性对应的值与根据列表变量中目标匹配结果渲染的标签的data-index属性对应的值相同。
8.一种小程序的输入装置，其特征在于，包括：
第一确定模块，用于当监测到在输入框的输入事件时，通过所述输入框绑定的回调函数确定用户输入的字符；
匹配结果得到模块，用于通过所述回调函数将所述字符与数据库进行匹配，得到与所述字符相关的匹配结果；
渲染/展示，用于将所述匹配结果存放到作为空数组的列表变量中，基于所述列表变量中的匹配结果渲染列表项，并将渲染的列表项进行展示；
第二确定模块，用于当监测到触发目标列表项时，通过所述目标列表项绑定的回调函数确定所述目标列表项的索引，根据所述索引从所述列表变量中确定对应的目标匹配结果；
设置模块，用于将所述目标匹配结果存放到作为空字符串的输入框变量中，将所述输入框变量中的目标匹配结果设置为所述目标列表项对应的内容，以将所述目标列表项对应的内容进行输入。
9.一种电子设备，其特征在于，包括：
一个或多个处理器；
存储装置，用于存储一个或多个程序，
当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-7任一所述的一种小程序的输入方法。
10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现如权利要求1-7任一项所述的一种小程序的输入方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010171934.7A CN111381689A (zh) | 2020-03-12 | 2020-03-12 | 一种小程序的输入方法、装置、电子设备及存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010171934.7A CN111381689A (zh) | 2020-03-12 | 2020-03-12 | 一种小程序的输入方法、装置、电子设备及存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111381689A true CN111381689A (zh) | 2020-07-07 |
Family
ID=71215487
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010171934.7A Pending CN111381689A (zh) | 2020-03-12 | 2020-03-12 | 一种小程序的输入方法、装置、电子设备及存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111381689A (zh) |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160360336A1 (en) * | 2015-05-27 | 2016-12-08 | Apple Inc. | Systems and Methods for Proactively Identifying and Surfacing Relevant Content on a Touch-Sensitive Device |
| CN108292323A (zh) * | 2016-01-08 | 2018-07-17 | 微软技术许可有限责任公司 | 使用数据源的元数据的数据库操作 |
| CN109976620A (zh) * | 2019-03-28 | 2019-07-05 | 北京字节跳动网络技术有限公司 | 列表项展现属性信息的确定方法、装置、设备及存储介质 |
| CN110209450A (zh) * | 2019-05-22 | 2019-09-06 | 腾讯科技（深圳）有限公司 | 页面生成方法、装置、存储介质及服务器 |
| CN110781269A (zh) * | 2019-09-29 | 2020-02-11 | 上海连尚网络科技有限公司 | 一种在阅读应用中进行书籍搜索的方法与设备 |
-
2020
- 2020-03-12 CN CN202010171934.7A patent/CN111381689A/zh active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160360336A1 (en) * | 2015-05-27 | 2016-12-08 | Apple Inc. | Systems and Methods for Proactively Identifying and Surfacing Relevant Content on a Touch-Sensitive Device |
| CN108292323A (zh) * | 2016-01-08 | 2018-07-17 | 微软技术许可有限责任公司 | 使用数据源的元数据的数据库操作 |
| CN109976620A (zh) * | 2019-03-28 | 2019-07-05 | 北京字节跳动网络技术有限公司 | 列表项展现属性信息的确定方法、装置、设备及存储介质 |
| CN110209450A (zh) * | 2019-05-22 | 2019-09-06 | 腾讯科技（深圳）有限公司 | 页面生成方法、装置、存储介质及服务器 |
| CN110781269A (zh) * | 2019-09-29 | 2020-02-11 | 上海连尚网络科技有限公司 | 一种在阅读应用中进行书籍搜索的方法与设备 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US9465529B1 (en) | Platform-independent environments for customizing user interfaces of native applications for portable electronic devices | |
| CN107656729B (zh) | 列表视图的更新装置、方法及计算机可读存储介质 | |
| CN110634049B (zh) | 页面显示内容的处理方法、装置、电子设备及可读介质 | |
| CN107832052B (zh) | 展示预览页面的方法、装置和存储介质以及电子设备 | |
| US20130036196A1 (en) | Method and system for publishing template-based content | |
| US20140026086A1 (en) | Methods and Systems for Cross-Platform Computing Applications Featuring Adaptable User Interfaces | |
| EP2866158A1 (en) | Method for reader to provide service, reader, terminal and computer storage medium | |
| CN112433730B (zh) | 代码检测规则的生成方法、装置和电子设备 | |
| CN111273830A (zh) | 显示数据方法、装置、电子设备和计算机可读介质 | |
| CN111177634A (zh) | 支持多语言的文案内容加载方法、装置、设备、及介质 | |
| US20140298316A1 (en) | Managing method for application program installation and electronic device | |
| CN110618811B (zh) | 信息呈现方法和装置 | |
| CN109857503B (zh) | 页面交互效果自适应方法、装置与电子设备 | |
| KR102074764B1 (ko) | 모바일 기기의 입력 인터페이스 내에서 맞춤법 검사를 지원하는 방법 및 시스템 | |
| CN111142990A (zh) | 一种微信小程序页面展示方法、装置、及存储介质 | |
| CN111381689A (zh) | 一种小程序的输入方法、装置、电子设备及存储介质 | |
| KR102158544B1 (ko) | 모바일 기기의 입력 인터페이스 내에서 맞춤법 검사를 지원하는 방법 및 시스템 | |
| CN111459933B (zh) | Gdb数据动态扩展方法、装置及存储介质 | |
| CN113672311A (zh) | 结构体赋值方法、赋值器及计算机可读存储介质 | |
| CN111414106A (zh) | 一种标题显示方法、装置、电子设备及计算机可读介质 | |
| CN113672317A (zh) | 用于渲染题目页面的方法和装置 | |
| WO2024212839A1 (zh) | 卡片布局方法、装置、介质及电子设备 | |
| CN114564246B (zh) | 一种在线绘制图形锚点的方法、装置、设备及介质 | |
| CN108415744A (zh) | 应用程序名称修改方法、装置、电子设备及存储介质 | |
| CN114780896B (zh) | 网页内容生成方法、装置及计算机可读存储介质 |
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 |
Application publication date: 20200707 |