Page input box position processing method and device, computer equipment and medium
By monitoring the keyboard pop-up event, calculating the keyboard height and adjusting the input box position, the problem of the input box being blocked when the keyboard pops up on the H5 page is solved, improving the user experience and input accuracy.
Patent Information
- Application Number
- CN202411358331.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-09-27
- Publication Date
- 2024-12-27
AI Technical Summary
On the H5 page, the input box is blocked when the keyboard pops up, resulting in a low user experience. Especially in the online customer service or chat page of financial companies, it affects the accuracy and real-timeness of user input, and may lead to unnecessary disputes or losses. .
By obtaining the operating system information of the target page, monitoring the keyboard pop-up event, calculating the keyboard height, and adjusting the position of the input box according to the status bar attribute information to ensure that the input box is not obscured by the keyboard. The specific steps include obtaining operating system information, determining whether it is an Android system, obtaining status bar properties, monitoring keyboard pop-up events, calculating keyboard height, obtaining input box adjustment strategies, and adjusting positions based on this information.
It effectively solves the problem that the input box is blocked when the keyboard pops up, improves the user experience, reduces the difficulty of user operations, ensures that the input box is always visible, and improves the accuracy and real-timeness of inputs.
Smart Images

Figure CN119202435A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the fields of data processing technology and financial technology, and in particular to methods, devices, computer equipment and storage media for processing the position of a page input box. Background Art
[0002] With the rapid development of mobile Internet technology, H5 (HTML5) web pages have gradually become an important choice for enterprises to reduce costs and improve efficiency due to their cross-platform, low development cost and easy maintenance. Especially in the fields of finance and e-commerce, H5 web pages are widely used in online customer service, chat pages and other scenarios to provide users with a convenient service experience. However, with the widespread application of H5 pages, some technical difficulties have gradually emerged, especially in terms of user interaction experience.
[0003] On mobile devices, when users input in the input box of the H5 page, they often encounter the situation where the keyboard pops up and blocks the input box, causing the user to be unable to see the input content. This problem is particularly prominent in the online customer service or chat pages of financial companies. Due to the particularity of financial services, users have extremely high requirements for the accuracy and real-time nature of information input. The blocked input box not only affects the user's input efficiency, but may also cause unnecessary disputes or losses due to incorrect information input, thus seriously reducing the user experience. Summary of the invention
[0004] The purpose of the embodiments of the present application is to propose a method, device, computer equipment and storage medium for processing the position of a page input box, so as to solve the technical problem that the input box on the existing H5 page is blocked when the keyboard pops up, resulting in a low user experience.
[0005] In order to solve the above technical problems, the embodiment of the present application provides a method for processing the position of a page input box, which adopts the following technical solution:
[0006] After the target page is loaded, obtaining target operating system information corresponding to the target page;
[0007] Determine whether the target operating system information is an Android system;
[0008] If so, obtaining status bar attribute information corresponding to the target page;
[0009] Based on the target monitoring strategy corresponding to the status bar attribute information, monitoring the keyboard pop-up event corresponding to the target page;
[0010] If a keyboard pop-up event is detected on the target page, the keyboard height corresponding to the target keyboard in the target page is obtained based on a preset keyboard height calculation strategy;
[0011] Obtaining an input box adjustment strategy corresponding to the status bar attribute information;
[0012] Based on the input box adjustment strategy and the keyboard height, the position of the input box of the target page is adjusted.
[0013] Furthermore, the step of monitoring the keyboard pop-up event corresponding to the target page based on the target monitoring strategy corresponding to the status bar attribute information specifically includes:
[0014] If the status bar attribute information is a non-immersive status bar, calling a preset specified event listener;
[0015] Based on the specified event listener, monitor and process the keyboard pop-up event corresponding to the target page;
[0016] If the status bar attribute information is an immersive status bar, calling a preset designated focus method;
[0017] A keyboard pop-up event corresponding to the target page is monitored and processed based on the specified focusing method.
[0018] Furthermore, the step of obtaining the keyboard height corresponding to the target keyboard in the target page based on the preset keyboard height calculation strategy specifically includes:
[0019] If the status bar attribute information is a non-immersive status bar, obtaining the initial visible height of the document window of the target page before loading;
[0020] Based on the callback function corresponding to the keyboard pop-up event, obtaining the specified visible height of the document window;
[0021] Calculating an absolute value of a difference between the initial visible height and the specified visible height, and using the absolute value of the difference as the keyboard height of the target keyboard;
[0022] If the status bar attribute information is an immersive status bar, calling a preset native method for obtaining the keyboard height;
[0023] A keyboard height corresponding to the target page is obtained based on the native method.
[0024] Furthermore, the step of adjusting the position of the input box of the target page based on the input box adjustment strategy and the keyboard height specifically includes:
[0025] If the status bar attribute information is a non-immersive status bar, obtaining a specified attribute style of the input box;
[0026] Modifying the specified attribute style based on the keyboard height so that the input box is located above the target keyboard;
[0027] If the status bar attribute information is an immersive status bar, calculating an adjustment position amount corresponding to the input box based on the keyboard height;
[0028] The position of the input box is adjusted accordingly based on the adjustment position amount.
[0029] Furthermore, the step of obtaining the target operating system information corresponding to the target page specifically includes:
[0030] Obtaining a user agent string of a browser corresponding to the target page;
[0031] Performing data analysis on the user agent character string to extract target keywords related to the operating system;
[0032] The target operating system information corresponding to the target page is determined based on the target keyword.
[0033] Furthermore, after the step of determining whether the target operating system information is an Android system, the method further includes:
[0034] If the target operating system information is an iOS system, a specified callback function corresponding to a specified event is called, and a delay setting is performed on the specified callback function based on a preset delay function and delay time;
[0035] After the keyboard pop-up event corresponding to the target page is monitored based on the specified callback function and the delay ends, determining whether the target page is in a pop-up state;
[0036] If the target page is not in the raised state, obtaining the target keyboard height of the target keyboard;
[0037] Obtaining a target positioning attribute of the input box;
[0038] The target positioning attribute is set to the target keyboard height to complete the position adjustment process for the input box of the target page.
[0039] Furthermore, the step of determining whether the target page is in a lifted state specifically includes:
[0040] Call the target property of the preset visual viewport interface;
[0041] Based on the target attribute, obtaining an offset of the top of the visual viewport in the target page relative to the layout viewport;
[0042] Determining whether the offset is greater than a preset offset threshold;
[0043] If so, determining that the target page is in a lifted state;
[0044] If not, it is determined that the target page is not in a lifted state.
[0045] In order to solve the above technical problems, the embodiment of the present application further provides a device for processing the position of a page input box, which adopts the following technical solution:
[0046] A first acquisition module, used for acquiring target operating system information corresponding to the target page after the target page is loaded;
[0047] A first determination module is used to determine whether the target operating system information is an Android system;
[0048] A second acquisition module, configured to acquire status bar attribute information corresponding to the target page;
[0049] A monitoring module, configured to monitor a keyboard pop-up event corresponding to the target page based on a target monitoring strategy corresponding to the status bar attribute information;
[0050] A third acquisition module is used to acquire the keyboard height corresponding to the target keyboard in the target page based on a preset keyboard height calculation strategy if a keyboard pop-up event occurs on the target page;
[0051] A fourth acquisition module, used to acquire an input box adjustment strategy corresponding to the status bar attribute information;
[0052] The adjustment module is used to adjust the position of the input box of the target page based on the input box adjustment strategy and the keyboard height.
[0053] In order to solve the above technical problems, the embodiment of the present application further provides a computer device, which adopts the following technical solution:
[0054] After the target page is loaded, obtaining target operating system information corresponding to the target page;
[0055] Determine whether the target operating system information is an Android system;
[0056] If so, obtaining status bar attribute information corresponding to the target page;
[0057] Based on the target monitoring strategy corresponding to the status bar attribute information, monitoring the keyboard pop-up event corresponding to the target page;
[0058] If a keyboard pop-up event is detected on the target page, the keyboard height corresponding to the target keyboard in the target page is obtained based on a preset keyboard height calculation strategy;
[0059] Obtaining an input box adjustment strategy corresponding to the status bar attribute information;
[0060] Based on the input box adjustment strategy and the keyboard height, the position of the input box of the target page is adjusted.
[0061] In order to solve the above technical problems, the embodiment of the present application further provides a computer-readable storage medium, which adopts the following technical solution:
[0062] After the target page is loaded, obtaining target operating system information corresponding to the target page;
[0063] Determine whether the target operating system information is an Android system;
[0064] If so, obtaining status bar attribute information corresponding to the target page;
[0065] Based on the target monitoring strategy corresponding to the status bar attribute information, monitoring the keyboard pop-up event corresponding to the target page;
[0066] If a keyboard pop-up event is detected on the target page, the keyboard height corresponding to the target keyboard in the target page is obtained based on a preset keyboard height calculation strategy;
[0067] Obtaining an input box adjustment strategy corresponding to the status bar attribute information;
[0068] Based on the input box adjustment strategy and the keyboard height, the position of the input box of the target page is adjusted.
[0069] Compared with the prior art, the embodiments of the present application have the following beneficial effects:
[0070] After the target page is loaded, the application obtains the target operating system information corresponding to the target page; then determines whether the target operating system information is an Android system; if so, obtains the status bar attribute information corresponding to the target page; then, based on the target monitoring strategy corresponding to the status bar attribute information, monitors the keyboard pop-up event corresponding to the target page; if a keyboard pop-up event is monitored on the target page, obtains the keyboard height corresponding to the target keyboard in the target page based on a preset keyboard height calculation strategy; subsequently, obtains the input box adjustment strategy corresponding to the status bar attribute information; finally, based on the input box adjustment strategy and the keyboard height, performs input box position adjustment processing on the target page. After the target page is loaded, the present application obtains the target operating system information corresponding to the target page, and obtains the status bar attribute information corresponding to the target page when detecting that the target operating system information is an Android system. When a keyboard pop-up event occurs on the target page based on the use of the target monitoring strategy corresponding to the status bar attribute information, the keyboard height corresponding to the target keyboard in the target page is obtained based on the preset keyboard height calculation strategy, and then the input box position adjustment processing is performed on the target page according to the input box adjustment strategy corresponding to the status bar attribute information and the keyboard height, so as to realize the combined use of the target monitoring strategy corresponding to the status bar attribute information, the keyboard height calculation strategy and the input box adjustment strategy to adapt to the detection of keyboard pop-up events, and automatically adjust the position of the input box to ensure that the input box is not blocked by the keyboard, thereby effectively solving the problem of the input box being blocked when the keyboard pops up on the H5 page, which is conducive to reducing the difficulty of user operation and thus improving user experience. BRIEF DESCRIPTION OF THE DRAWINGS
[0071] In order to more clearly illustrate the scheme in the present application, a brief introduction is given below to the drawings required for use in the description of the embodiments of the present application. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.
[0072] Figure 1 is an exemplary system architecture diagram to which the present application may be applied;
[0073] Figure 2 A flowchart of an embodiment of a method for processing the position of a page input box according to the present application;
[0074] Figure 3 is a structural schematic diagram of an embodiment of a device for processing a position of a page input box according to the present application;
[0075] Figure 4 It is a structural diagram of an embodiment of a computer device according to the present application. DETAILED DESCRIPTION
[0076] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by technicians in the technical field of the present application; the terms used in the specification of the application herein are only for the purpose of describing specific embodiments and are not intended to limit the present application; the terms "including" and "having" and any variations thereof in the specification and claims of the present application and the above-mentioned drawings are intended to cover non-exclusive inclusions. The terms "first", "second", etc. in the specification and claims of the present application or the above-mentioned drawings are used to distinguish different objects, not to describe a specific order.
[0077] Reference to "embodiments" herein means that a particular feature, structure, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those skilled in the art that the embodiments described herein may be combined with other embodiments.
[0078] In order to enable those skilled in the art to better understand the solution of the present application, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the accompanying drawings.
[0079] like Figure 1 As shown, the system architecture 100 may include a terminal device 101, a network 102 and a server 103. The terminal device 101 may be a laptop 1011, a tablet computer 1012 or a mobile phone 1013. The network 102 is used to provide a medium for a communication link between the terminal device 101 and the server 103. The network 102 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.
[0080] The user can use the terminal device 101 to interact with the server 103 through the network 102 to receive or send messages, etc. Various communication client applications can be installed on the terminal device 101, such as web browser applications, shopping applications, search applications, instant messaging tools, email clients, social platform software, etc.
[0081] The terminal device 101 can be any electronic device with a display screen and supporting web browsing. In addition to the laptop computer 1011, tablet computer 1012 or mobile phone 1013, the terminal device 101 can also be an e-book reader, an MP3 player (Moving Picture Experts Group Audio Layer III), an MP4 (Moving Picture Experts Group Audio Layer IV), a laptop computer, a desktop computer, etc.
[0082] The server 103 may be a server that provides various services, such as a background server that provides support for a web page displayed on the terminal device 101 .
[0083] It should be noted that the method for processing the position of the page input box provided in the embodiment of the present application is generally executed by a server / terminal device, and accordingly, the device for processing the position of the page input box is generally arranged in the server / terminal device.
[0084] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to the implementation requirements.
[0085] Continue to refer Figure 2 , showing a flow chart of an embodiment of a method for processing the position of a page input box according to the present application. According to different requirements, the order of the steps in the flow chart can be changed, and some steps can be omitted. The method for processing the position of a page input box provided in the embodiment of the present application can be applied to any scenario where the position of a page input box needs to be processed, and the method for processing the position of a page input box can be applied to products in these scenarios, for example, the position adjustment processing of the input box of a financial page in the financial insurance field. The method for processing the position of a page input box comprises the following steps:
[0086] Step S201, after the target page is loaded, obtain the target operating system information corresponding to the target page.
[0087] In this embodiment, the method for processing the position of the page input box is executed on the electronic device (eg Figure 1The server / terminal device shown in the figure) can obtain the target operating system information through a wired connection or a wireless connection. It should be pointed out that the above-mentioned wireless connection method may include but is not limited to 3G / 4G / 5G connection, WiFi connection, Bluetooth connection, WiMAX connection, Zigbee connection, UWB (ultra wideband) connection, and other wireless connection methods currently known or to be developed in the future. The target page is specifically an H5 page. In the business scenarios in the financial and insurance fields, the above-mentioned target page may be an insurance consultation page, a claims page, a financial product recommendation page, etc. in the H5 format. Among them, the specific implementation process of obtaining the target operating system information corresponding to the target page will be further described in detail in the subsequent specific embodiments of this application, and will not be elaborated on here.
[0088] Step S202, determining whether the target operating system information is an Android system.
[0089] In this embodiment, the target operating system information may include an Android system or an iOS system.
[0090] Step S203: If yes, obtain the status bar attribute information corresponding to the target page.
[0091] In this embodiment, the above-mentioned status bar attribute information includes a non-immersive status bar and an immersive status bar. The Android system (Android) is divided into a non-immersive status bar and an immersive status bar. Specifically, non-immersive status bar: In this mode, the status bar (the area that displays information such as time and signal strength) is always visible and is located at the top of the screen. When the soft keyboard pops up, it covers the content below the status bar, but does not cover the status bar itself. In non-immersive mode, the height of the soft keyboard can be estimated by listening to the resize event and calculating the height difference. Immersive status bar: The immersive status bar is designed to provide a more immersive user experience. When the application enters full-screen mode, the status bar will be hidden or become transparent. This means that when the soft keyboard pops up, it may cover the contents of the entire screen, including the area originally occupied by the status bar. In immersive mode, due to the hiding of the status bar, traditional resize event monitoring and height calculation methods may no longer be applicable, because changes in the entire visible area may no longer be caused solely by the soft keyboard.
[0092] Step S204: monitoring a keyboard pop-up event corresponding to the target page based on a target monitoring strategy corresponding to the status bar attribute information.
[0093] In this embodiment, the above-mentioned target monitoring strategy corresponding to the status bar attribute information is based on the specific implementation process of monitoring the keyboard pop-up event corresponding to the target page. This application will provide further details in subsequent specific embodiments and will not be elaborated here.
[0094] Step S205: If a keyboard pop-up event is detected on the target page, a keyboard height corresponding to a target keyboard in the target page is obtained based on a preset keyboard height calculation strategy.
[0095] In this embodiment, the specific implementation process of obtaining the keyboard height corresponding to the target keyboard in the target page based on the preset keyboard height calculation strategy will be further described in detail in subsequent specific embodiments of the present application and will not be elaborated on here.
[0096] Step S206: obtaining an input box adjustment strategy corresponding to the status bar attribute information.
[0097] In this embodiment, the input box adjustment strategy includes a first input box adjustment strategy corresponding to the non-immersive status bar, and a second input box adjustment strategy corresponding to the immersive status bar. The application will further describe the policy processing steps of the first input box adjustment strategy and the second input box adjustment strategy in subsequent specific embodiments, and will not be elaborated on here.
[0098] Step S207: Based on the input box adjustment strategy and the keyboard height, the position of the input box of the target page is adjusted.
[0099] In this embodiment, the specific implementation process of adjusting the position of the input box of the target page based on the input box adjustment strategy and the keyboard height will be described in further detail in subsequent specific embodiments of the present application and will not be elaborated on here.
[0100] After the target page is loaded, the application obtains the target operating system information corresponding to the target page; then determines whether the target operating system information is an Android system; if so, obtains the status bar attribute information corresponding to the target page; then, based on the target monitoring strategy corresponding to the status bar attribute information, monitors the keyboard pop-up event corresponding to the target page; if a keyboard pop-up event is monitored on the target page, obtains the keyboard height corresponding to the target keyboard in the target page based on a preset keyboard height calculation strategy; subsequently, obtains the input box adjustment strategy corresponding to the status bar attribute information; finally, based on the input box adjustment strategy and the keyboard height, performs input box position adjustment processing on the target page. After the target page is loaded, the present application obtains the target operating system information corresponding to the target page, and obtains the status bar attribute information corresponding to the target page when detecting that the target operating system information is an Android system. When a keyboard pop-up event occurs on the target page based on the use of the target monitoring strategy corresponding to the status bar attribute information, the keyboard height corresponding to the target keyboard in the target page is obtained based on the preset keyboard height calculation strategy, and then the input box position adjustment processing is performed on the target page according to the input box adjustment strategy corresponding to the status bar attribute information and the keyboard height, so as to realize the combined use of the target monitoring strategy corresponding to the status bar attribute information, the keyboard height calculation strategy and the input box adjustment strategy to adapt to the detection of keyboard pop-up events, and automatically adjust the position of the input box to ensure that the input box is not blocked by the keyboard, thereby effectively solving the problem of the input box being blocked when the keyboard pops up on the H5 page, which is conducive to reducing the difficulty of user operation and thus improving user experience.
[0101] In some optional implementations, step S204 includes the following steps:
[0102] If the status bar attribute information is a non-immersive status bar, a preset designated event listener is called.
[0103] In this embodiment, the above-mentioned designated event listener is a listener for a resize event added to the window object using the addEventListener method of JavaScript after the target page is loaded. The above-mentioned designated event listener is a function that is called when the browser window size changes, including changes caused by the pop-up of the soft keyboard.
[0104] The keyboard pop-up event corresponding to the target page is monitored and processed based on the designated event listener.
[0105] In this embodiment, on an Android device, when a user opens a soft keyboard, since the soft keyboard occupies a portion of the screen space, a resize event is triggered, which in turn triggers a corresponding keyboard pop-up event.
[0106] If the status bar attribute information is an immersive status bar, a preset designated focus method is called.
[0107] In this embodiment, the immersive status bar means that the application can display content in full screen, and the status bar and navigation bar appear in a transparent or semi-transparent manner when needed, without occupying screen space. The immersive status bar mode can be enabled by calling the getWindow().getDecorView().setSystemUiVisibility() method in the onCreate method of the Activity or the appropriate life cycle callback, and passing in the corresponding flag bit.
[0108] Among them, Android does not directly provide an API for monitoring keyboard opening events. The above-mentioned specified focus method is specifically the onWindowFocusChanged(boolean hasFocus) method.
[0109] A keyboard pop-up event corresponding to the target page is monitored and processed based on the specified focusing method.
[0110] In this embodiment, the above-mentioned specified focus method can be used to indirectly determine whether the keyboard is open. When the application loses focus (usually because the user clicks the input box to cause the keyboard to pop up), it is considered that the keyboard is open and the corresponding keyboard pop-up event is triggered.
[0111] In this application, if the status bar attribute information is a non-immersive status bar, the preset designated event listener is called; then the keyboard pop-up event corresponding to the target page is monitored and processed based on the designated event listener; and if the status bar attribute information is an immersive status bar, the preset designated focus method is called; subsequently, the keyboard pop-up event corresponding to the target page is monitored and processed based on the designated focus method. In this application, when it is detected that the status bar attribute information corresponding to the target page is a non-immersive status bar, the designated event listener is intelligently called to monitor and process the keyboard pop-up event corresponding to the target page, and when it is detected that the status bar attribute information corresponding to the target page is an immersive status bar, the designated focus method is intelligently called to monitor and process the keyboard pop-up event corresponding to the target page, so as to adapt and accurately implement the monitoring and processing of the keyboard pop-up event of the target page by combining the use of multiple target monitoring strategies, thereby improving the intelligence and adaptability of the monitoring and processing of the keyboard pop-up event.
[0112] In some optional implementations of this embodiment, step S205 includes the following steps:
[0113] If the status bar attribute information is a non-immersive status bar, the initial visible height of the document window of the target page before loading is obtained.
[0114] In this embodiment, after the target page is loaded, but before the specified event listener, i.e., the resize event listener, is added, an initial document.documentElement.clientHeight value is first recorded. This value represents the visible height of the document viewport when no soft keyboard pops up, i.e., the initial visible height.
[0115] Based on the callback function corresponding to the keyboard pop-up event, the specified visible height of the document window is obtained.
[0116] In this embodiment, in the callback function of the resize event, the value of document.documentElement.clientHeight is obtained again and used as the above-mentioned specified visible height. Among them, since the pop-up of the soft keyboard will reduce the height of the visible area, the value of the newly obtained visible height will be smaller than the value of the initial visible height. In addition, a threshold value (such as 50px) can be set according to actual needs. If the absolute value of the difference between the newly obtained visible height and the initial visible height is greater than this threshold, it can be considered that the soft keyboard has been opened and the difference is roughly equal to the height of the soft keyboard.
[0117] The absolute value of the difference between the initial visible height and the designated visible height is calculated, and the absolute value of the difference is used as the keyboard height of the target keyboard.
[0118] In this embodiment, the keyboard height of the target keyboard may be obtained by calculating the difference between the initial visible height and the designated visible height and taking the absolute value.
[0119] If the status bar attribute information is an immersive status bar, a preset native method for obtaining the keyboard height is called.
[0120] In this embodiment, it is possible to detect whether a native method for obtaining the keyboard height is provided in the electronic device. If it is detected that a native method for obtaining the keyboard height is provided, the native method for obtaining the keyboard height is directly called.
[0121] A keyboard height corresponding to the target page is obtained based on the native method.
[0122] In this embodiment, the keyboard height corresponding to the target page can be directly obtained according to the called native method for obtaining the keyboard height. In addition, if the electronic device does not provide a native method for obtaining the keyboard height, other methods are used, such as comparing the window size change to estimate the keyboard height.
[0123] In this application, if the status bar attribute information is a non-immersive status bar, the initial visible height of the document window of the target page before loading is obtained; then based on the callback function corresponding to the keyboard pop-up event, the specified visible height of the document window is obtained; then the absolute value of the difference between the initial visible height and the specified visible height is calculated, and the absolute value of the difference is used as the keyboard height of the target keyboard; and if the status bar attribute information is an immersive status bar, a preset native method for obtaining the keyboard height is called; and then the keyboard height corresponding to the target page is obtained based on the native method. When the application detects that the status bar attribute information corresponding to the target page is a non-immersive status bar, the initial visible height of the document window of the target page before loading is intelligently obtained, and based on the callback function corresponding to the keyboard pop-up event, the specified visible height of the document window is obtained, and then the absolute value of the difference between the initial visible height and the specified visible height is calculated to obtain the keyboard height of the target keyboard. When it is detected that the status bar attribute information corresponding to the target page is an immersive status bar, the preset native method for obtaining the keyboard height is directly called to obtain the keyboard height corresponding to the target page, so as to adapt and accurately implement the calculation processing of the keyboard height corresponding to the target keyboard in the target page by combining the use of multiple keyboard height calculation strategies, thereby improving the intelligence and adaptability of the calculation processing of the keyboard height.
[0124] In some optional implementations, step S207 includes the following steps:
[0125] If the status bar attribute information is a non-immersive status bar, a specified attribute style of the input box is obtained.
[0126] In this embodiment, the above-mentioned specified attribute style is a CSS style, specifically the margin-bottom or bottom attribute of the input box.
[0127] The designated attribute style is modified based on the keyboard height so that the input box is located above the target keyboard.
[0128] In this embodiment, after obtaining the keyboard height of the target keyboard, the margin-bottom or bottom attribute of the input box can be adjusted according to the keyboard height to move the input box downward and leave enough space for the soft keyboard (i.e., the target keyboard). The position adjustment amount is equal to or slightly greater than the calculated soft keyboard height to ensure that the input box is completely visible and located above the target keyboard.
[0129] If the status bar attribute information is an immersive status bar, an adjustment position amount corresponding to the input box is calculated based on the keyboard height.
[0130] In this embodiment, after calculating the keyboard height of the target keyboard, the position amount of the input box that needs to be adjusted, i.e., the above-mentioned position adjustment amount, can be calculated based on the keyboard height. Specifically, if the input box is fixed at the bottom of the screen, it is moved upward by a distance equal to the keyboard height. If the input box is located at other positions on the screen, the adjustment amount is calculated based on the specific situation to ensure that the input box is located above the target keyboard.
[0131] The position of the input box is adjusted accordingly based on the adjustment position amount.
[0132] In this embodiment, the position of the input box can be dynamically adjusted according to the calculated adjustment position. Specifically, the layout parameters of the input box (such as MarginLayoutParams) can be modified or animation effects can be used to smoothly move the input box. In Android, the layout parameters of the input box are updated by calling the setLayoutParams method of the input box, or classes such as ObjectAnimator are used to implement animation effects.
[0133] In this application, if the status bar attribute information is a non-immersive status bar, the specified attribute style of the input box is obtained; then the specified attribute style is modified based on the keyboard height so that the input box is located above the target keyboard; and if the status bar attribute information is an immersive status bar, the adjustment position amount corresponding to the input box is calculated based on the keyboard height; then the position of the input box is adjusted accordingly based on the adjustment position amount. When the status bar attribute information corresponding to the target page is detected to be a non-immersive status bar, the specified attribute style of the input box is intelligently obtained, and then the specified attribute style is modified based on the keyboard height so that the input box is located above the target keyboard. And when the status bar attribute information corresponding to the target page is detected to be an immersive status bar, the adjustment position amount corresponding to the input box is intelligently calculated based on the keyboard height, and then the position of the input box is adjusted accordingly based on the adjustment position amount, thereby adapting and accurately implementing the position adjustment processing of the input box on the target page by combining the use of multiple input box adjustment strategies, effectively improving the intelligence and adaptability of the position adjustment processing of the input box.
[0134] In some optional implementations, step S201 includes the following steps:
[0135] Get the user agent string of the browser corresponding to the target page.
[0136] In this embodiment, the user agent string of the browser corresponding to the target page can be obtained by using navigator.userAgent. The user agent string is a string sent by the browser to the server, which contains detailed information about the browser, operating system, device, etc.
[0137] Data analysis is performed on the user agent character string to extract target keywords related to the operating system.
[0138] In this embodiment, the target keyword is a specific keyword or pattern related to the operating system in the user agent string. These keywords or patterns are usually related to iOS (such as "iPhone", "iPad", "iPod", "Mac") or Android (such as "Android").
[0139] The target operating system information corresponding to the target page is determined based on the target keyword.
[0140] In this embodiment, the platform currently being used by the user can be determined based on the target keyword contained in the obtained user agent character string, and then the target operating system information corresponding to the target page can be obtained.
[0141] The present application obtains the user agent string of the browser corresponding to the target page; then performs data analysis on the user agent string to extract the target keywords related to the operating system; and subsequently determines the target operating system information corresponding to the target page based on the target keywords. The present application obtains the user agent string of the browser corresponding to the target page, and performs data analysis on the user agent string to extract the target keywords related to the operating system, and then based on the target keywords, it can quickly and accurately determine the target operating system information corresponding to the target page, thereby improving the efficiency of obtaining the target operating system information and ensuring the accuracy of the obtained target operating system information.
[0142] In some optional implementations of this embodiment, after step S202, the electronic device may further perform the following steps:
[0143] If the target operating system information is an iOS system, a specified callback function corresponding to a specified event is called, and a delay setting is performed on the specified callback function based on a preset delay function and delay time.
[0144] In the present embodiment, the above-mentioned specified event is specifically a resize event. The above-mentioned delay function is specifically setTimeout. After the target page is loaded, a listener for the global resize event can be added. In addition, since there may be a delay between the keyboard popping up and the viewport size changing, setTimeout is used to set a delay. Specifically, in the callback function of the resize event, setTimeout is used to set a short delay (for example, 300 milliseconds). After the delay ends, a function can be executed to check whether the target page is lifted up and the possible keyboard height.
[0145] After a keyboard pop-up event corresponding to the target page is monitored based on the designated callback function and the delay ends, it is determined whether the target page is in a pop-up state.
[0146] In this embodiment, the above-mentioned lifting state refers to the page being lifted up. The specific implementation process of the above-mentioned determination of whether the target page is in the lifting state will be further described in detail in the subsequent specific embodiments of this application, and will not be elaborated on here.
[0147] If the target page is not in the raised state, the target keyboard height of the target keyboard is obtained.
[0148] In this embodiment, the process of obtaining the target keyboard height of the target keyboard may include: recording the position of an input box or an element at the bottom of the page before and after the keyboard pops up. When the resize event is triggered and the delay ends, these positions are obtained again, and the difference between them is calculated. This difference reflects the height of the keyboard, and the difference is used as the target keyboard height of the target keyboard. In addition, if the target page is lifted up, that is, in a lifted state, and the input box has risen above the keyboard with the page, no additional adjustment is required, or the bottom attribute of the input box can be set to 0 to keep it at the bottom of the screen.
[0149] Gets the target positioning attribute of the input box.
[0150] In this embodiment, the target positioning attribute is the bottom attribute.
[0151] The target positioning attribute is set to the target keyboard height to complete the position adjustment process for the input box of the target page.
[0152] In this embodiment, the bottom attribute of the input box can be set to the target keyboard height, that is, the position of the input box is adjusted to a position at a distance from the bottom equal to the keyboard height, so that the input box is located above the target keyboard.
[0153] If the present application detects that the target operating system information is an iOS system, the specified callback function corresponding to the specified event is called, and the specified callback function is delayed based on the preset delay function and delay time; then, after the keyboard pop-up event corresponding to the target page is monitored based on the specified callback function and the delay ends, it is determined whether the target page is in a top-up state; if the target page is not in a top-up state, the target keyboard height of the target keyboard is obtained; then the target positioning attribute of the input box is obtained; and subsequently the target positioning attribute is set to the target keyboard height to complete the position adjustment processing of the input box of the target page. When the present application detects that the target operating system information is an iOS system, the specific keyboard height calculation strategy and the specific input box adjustment strategy that match the iOS system are intelligently adopted to adapt and accurately implement the position adjustment processing of the input box of the target page, which effectively solves the problem of the input box being blocked when the keyboard pops up on the iOS platform, and improves the intelligence and adaptability of the position adjustment processing of the input box.
[0154] In some optional implementations of this embodiment, the determining whether the target page is in a lifted state comprises the following steps:
[0155] Calls the target property of the preset visual viewport interface.
[0156] In this embodiment, the visual viewport interface specifically refers to the visualViewport interface. The target attribute specifically refers to the window.visualViewport.offsetTop attribute.
[0157] The offset of the top of the visual viewport in the target page relative to the layout viewport is obtained based on the target attribute.
[0158] In this embodiment, the offset of the top of the visual viewport in the target page relative to the layout viewport can be obtained by accessing the window.visualViewport.offsetTop property.
[0159] It is determined whether the offset is greater than a preset offset threshold.
[0160] In this embodiment, there is no specific limitation on the value of the above offset threshold, which can be set according to actual business needs. If the obtained offset is greater than the offset threshold, it is considered that the page is pushed up and the input box may be visible. If the offset is less than the offset threshold, it is considered that the page is not pushed up.
[0161] If so, it is determined that the target page is in a lifted state.
[0162] In this embodiment, if the offset is greater than the offset threshold, it is determined that the target page is in a lifted state.
[0163] If not, it is determined that the target page is not in a lifted state.
[0164] In this embodiment, if the offset is smaller than the offset threshold, it is determined that the target page is not in the lifted state.
[0165] The present application calls the target attribute of a preset visual viewport interface; then obtains the offset of the top of the visual viewport in the target page relative to the layout viewport based on the target attribute; subsequently determines whether the offset is greater than a preset offset threshold; if so, determines that the target page is in a top-up state; if not, determines that the target page is not in a top-up state. The present application calls the target attribute of a preset visual viewport interface, and obtains the offset of the top of the visual viewport in the target page relative to the layout viewport based on the target attribute. If it is detected that the offset is greater than the preset offset threshold, the target page is determined to be in a top-up state, otherwise it is determined that the target page is not in a top-up state. In this way, by analyzing and processing the offset of the top of the visual viewport in the target page relative to the layout viewport based on the target attribute of the visual viewport interface and the use of the offset threshold, it is possible to quickly and accurately detect whether the target page is in a top-up state, thereby ensuring the accuracy of the obtained state detection result.
[0166] In some optional implementations, the user information obtained is subject to the user's consent and complies with relevant laws and policies.
[0167] It should be understood that the order of execution of the steps in the above embodiment does not necessarily mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiment of the present invention.
[0168] It should be emphasized that in order to further ensure the privacy and security of the above keyboard height, the above keyboard height can also be stored in a blockchain node.
[0169] The blockchain referred to in this application is a new application model of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, encryption algorithm, etc. Blockchain is essentially a decentralized database, a string of data blocks generated by cryptographic methods. Each data block contains a batch of network transaction information, which is used to verify the validity of its information (anti-counterfeiting) and generate the next block. Blockchain can include the underlying blockchain platform, platform product service layer, and application service layer.
[0170] The embodiments of the present application can acquire and process relevant data based on artificial intelligence technology. Among them, artificial intelligence (AI) is the theory, method, technology and application system that uses digital computers or machines controlled by digital computers to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results.
[0171] AI basic technologies generally include sensors, dedicated AI chips, cloud computing, distributed storage, big data processing technology, operation / interaction systems, mechatronics, etc. AI software technologies mainly include computer vision technology, robotics technology, biometrics technology, speech processing technology, natural language processing technology, and machine learning / deep learning.
[0172] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiments can be implemented by instructing the relevant hardware through computer-readable instructions, and the computer-readable instructions can be stored in a computer-readable storage medium. When the program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, the aforementioned storage medium can be a non-volatile storage medium such as a disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).
[0173] It should be understood that, although the steps in the flowchart of the accompanying drawings are displayed in sequence as indicated by the arrows, these steps are not necessarily executed in sequence in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least a part of the steps in the flowchart of the accompanying drawings may include multiple sub-steps or multiple stages, and these sub-steps or stages are not necessarily executed at the same time, but can be executed at different times, and their execution order is not necessarily sequential, but can be executed in turn or alternately with other steps or at least a part of the sub-steps or stages of other steps.
[0174] Further references Figure 3 , as a response to the above Figure 2 The present application provides an embodiment of a device for processing the position of a page input box. Figure 2 Corresponding to the method embodiment shown, the device can be specifically applied to various electronic devices.
[0175] like Figure 3 As shown, the position processing device 300 of the page input box described in this embodiment includes: a first acquisition module 301, a first judgment module 302, a second acquisition module 303, a monitoring module 304, a third acquisition module 305, a fourth acquisition module 306 and an adjustment module 307. Among them:
[0176] A first acquisition module 301 is used to acquire target operating system information corresponding to the target page after the target page is loaded;
[0177] A first determination module 302 is used to determine whether the target operating system information is an Android system;
[0178] A second acquisition module 303 is used to acquire the status bar attribute information corresponding to the target page;
[0179] A monitoring module 304, configured to monitor a keyboard pop-up event corresponding to the target page based on a target monitoring strategy corresponding to the status bar attribute information;
[0180] The third acquisition module 305 is used to acquire the keyboard height corresponding to the target keyboard in the target page based on a preset keyboard height calculation strategy if a keyboard pop-up event occurs on the target page;
[0181] A fourth acquisition module 306 is used to acquire an input box adjustment strategy corresponding to the status bar attribute information;
[0182] The adjustment module 307 is used to adjust the position of the input box of the target page based on the input box adjustment strategy and the keyboard height.
[0183] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0184] In some optional implementations of this embodiment, the monitoring module 304 includes:
[0185] A first calling submodule, configured to call a preset designated event listener if the status bar attribute information is a non-immersive status bar;
[0186] A first monitoring submodule, configured to monitor and process a keyboard pop-up event corresponding to the target page based on the specified event monitor;
[0187] A second calling submodule, configured to call a preset designated focusing method if the status bar attribute information is an immersive status bar;
[0188] The second monitoring submodule is used to monitor and process the keyboard pop-up event corresponding to the target page based on the specified focusing method.
[0189] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0190] In some optional implementations of this embodiment, the third acquisition module 305 includes:
[0191] A first acquisition submodule, configured to acquire an initial visible height of a document window of the target page before loading if the status bar attribute information is a non-immersive status bar;
[0192] A second acquisition submodule, configured to acquire a specified visible height of the document window based on a callback function corresponding to the keyboard pop-up event;
[0193] A first calculation submodule, configured to calculate an absolute value of a difference between the initial visible height and the specified visible height, and use the absolute value of the difference as a keyboard height of the target keyboard;
[0194] A third calling submodule, configured to call a preset native method for obtaining the keyboard height if the status bar attribute information is an immersive status bar;
[0195] The third acquisition submodule is used to acquire the keyboard height corresponding to the target page based on the native method.
[0196] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0197] In some optional implementations of this embodiment, the adjustment module 307 includes:
[0198] A fourth acquisition submodule, configured to acquire a specified attribute style of the input box if the status bar attribute information is a non-immersive status bar;
[0199] A modification submodule, used for modifying the specified attribute style based on the keyboard height so that the input box is located above the target keyboard;
[0200] A second calculation submodule, configured to calculate an adjustment position amount corresponding to the input box based on the keyboard height if the status bar attribute information is an immersive status bar;
[0201] The adjustment submodule is used to perform corresponding adjustment processing on the position of the input box based on the adjustment position amount.
[0202] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0203] In some optional implementations of this embodiment, the first acquisition module 301 includes:
[0204] A fifth acquisition submodule, used to acquire a user agent string of a browser corresponding to the target page;
[0205] An extraction submodule, used to perform data analysis on the user agent string to extract target keywords related to the operating system;
[0206] The determination submodule is used to determine the target operating system information corresponding to the target page based on the target keyword.
[0207] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0208] In some optional implementations of this embodiment, the position processing device of the page input box further includes:
[0209] A processing module, configured to call a specified callback function corresponding to a specified event if the target operating system information is an iOS system, and perform a delay setting on the specified callback function based on a preset delay function and delay time;
[0210] A second judgment module is used to judge whether the target page is in a pop-up state after a keyboard pop-up event corresponding to the target page is monitored based on the specified callback function and the delay ends;
[0211] A fifth acquisition module, configured to acquire a target keyboard height of the target keyboard if the target page is not in a raised state;
[0212] A sixth acquisition module, used to acquire a target positioning attribute of the input box;
[0213] The setting module is used to set the target positioning attribute to the target keyboard height to complete the position adjustment processing of the input box of the target page.
[0214] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0215] In some optional implementations of this embodiment, the second determination module includes:
[0216] The fourth calling submodule is used to call the target attribute of the preset visual viewport interface;
[0217] A sixth acquisition submodule, configured to acquire, based on the target attribute, an offset of the top of the visual viewport in the target page relative to the layout viewport;
[0218] A judging submodule, used to judge whether the offset is greater than a preset offset threshold;
[0219] A first determination submodule, configured to determine if the target page is in a lifted state;
[0220] The second determination submodule is used to determine if the target page is not in the lifted state.
[0221] In this embodiment, the operations performed by the above modules or units correspond one-to-one to the steps of the method for processing the position of the page input box in the above-mentioned embodiment, and are not described in detail here.
[0222] To solve the above technical problems, the present application also provides a computer device. Figure 4 , Figure 4 This is a basic structural block diagram of the computer device in this embodiment.
[0223] The computer device 4 includes a memory 41, a processor 42, and a network interface 43 that are interconnected through a system bus. It should be noted that the figure only shows a computer device 4 with components 41-43, but it should be understood that it is not required to implement all the components shown, and more or fewer components can be implemented instead. Among them, those skilled in the art can understand that the computer device here is a device that can automatically perform numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes but is not limited to microprocessors, application specific integrated circuits (Application Specific Integrated Circuit, ASIC), programmable gate arrays (Field-Programmable Gate Array, FPGA), digital processors (Digital Signal Processor, DSP), embedded devices, etc.
[0224] The computer device may be a computing device such as a desktop computer, a notebook, a PDA, a cloud server, etc. The computer device may interact with a user through a keyboard, a mouse, a remote controller, a touch pad, or a voice control device.
[0225] The memory 41 includes at least one type of readable storage medium, and the readable storage medium includes flash memory, hard disk, multimedia card, card-type memory (for example, SD or DX memory, etc.), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, disk, optical disk, etc. In some embodiments, the memory 41 can be an internal storage unit of the computer device 4, such as a hard disk or memory of the computer device 4. In other embodiments, the memory 41 can also be an external storage device of the computer device 4, such as a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card, a flash card (FlashCard), etc. equipped on the computer device 4. Of course, the memory 41 can also include both the internal storage unit of the computer device 4 and its external storage device. In this embodiment, the memory 41 is generally used to store the operating system and various application software installed on the computer device 4, such as computer-readable instructions of the position processing method of the page input box, etc. In addition, the memory 41 can also be used to temporarily store various types of data that have been output or are to be output.
[0226] The processor 42 may be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chips in some embodiments. The processor 42 is generally used to control the overall operation of the computer device 4. In this embodiment, the processor 42 is used to run the computer-readable instructions stored in the memory 41 or process data, such as running the computer-readable instructions of the position processing method of the page input box.
[0227] The network interface 43 may include a wireless network interface or a wired network interface. The network interface 43 is generally used to establish a communication connection between the computer device 4 and other electronic devices.
[0228] The present application also provides another implementation, namely, providing a computer-readable storage medium, wherein the computer-readable storage medium stores computer-readable instructions, and the computer-readable instructions can be executed by at least one processor to enable the at least one processor to perform the steps of the page input box position processing method as described above.
[0229] Through the description of the above implementation methods, those skilled in the art can clearly understand that the above-mentioned embodiment methods can be implemented by means of software plus a necessary general hardware platform, and of course by hardware, but in many cases the former is a better implementation method. Based on such an understanding, the technical solution of the present application, or the part that contributes to the prior art, can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk), and includes a number of instructions for a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in each embodiment of the present application.
[0230] Obviously, the embodiments described above are only some embodiments of the present application, rather than all embodiments. The preferred embodiments of the present application are given in the accompanying drawings, but they do not limit the patent scope of the present application. The present application can be implemented in many different forms. On the contrary, the purpose of providing these embodiments is to make the understanding of the disclosure of the present application more thorough and comprehensive. Although the present application is described in detail with reference to the aforementioned embodiments, for those skilled in the art, it is still possible to modify the technical solutions recorded in the aforementioned specific implementation methods, or to perform equivalent replacement of some of the technical features therein. Any equivalent structure made using the contents of the specification and drawings of this application, directly or indirectly used in other related technical fields, is similarly within the scope of patent protection of this application.
Claims
1. A method for processing the position of a page input box, characterized in that: The steps include: After the target page is loaded, obtaining target operating system information corresponding to the target page; Determine whether the target operating system information is an Android system; If so, obtaining status bar attribute information corresponding to the target page; Based on the target monitoring strategy corresponding to the status bar attribute information, monitoring the keyboard pop-up event corresponding to the target page; If a keyboard pop-up event is detected on the target page, the keyboard height corresponding to the target keyboard in the target page is obtained based on a preset keyboard height calculation strategy; Obtaining an input box adjustment strategy corresponding to the status bar attribute information; Based on the input box adjustment strategy and the keyboard height, the position of the input box of the target page is adjusted.
2. The method for processing the position of a page input box according to claim 1, characterized in that: The step of monitoring the keyboard pop-up event corresponding to the target page based on the target monitoring strategy corresponding to the status bar attribute information specifically includes: If the status bar attribute information is a non-immersive status bar, calling a preset specified event listener; Based on the specified event listener, monitor and process the keyboard pop-up event corresponding to the target page; If the status bar attribute information is an immersive status bar, calling a preset designated focus method; A keyboard pop-up event corresponding to the target page is monitored and processed based on the specified focusing method.
3. The method for processing the position of a page input box according to claim 1, characterized in that: The step of obtaining the keyboard height corresponding to the target keyboard in the target page based on the preset keyboard height calculation strategy specifically includes: If the status bar attribute information is a non-immersive status bar, obtaining the initial visible height of the document window of the target page before loading; Based on the callback function corresponding to the keyboard pop-up event, obtaining the specified visible height of the document window; Calculating an absolute value of a difference between the initial visible height and the specified visible height, and using the absolute value of the difference as the keyboard height of the target keyboard; If the status bar attribute information is an immersive status bar, calling a preset native method for obtaining the keyboard height; A keyboard height corresponding to the target page is obtained based on the native method.
4. The method for processing the position of a page input box according to claim 1, characterized in that: The step of adjusting the position of the input box of the target page based on the input box adjustment strategy and the keyboard height specifically includes: If the status bar attribute information is a non-immersive status bar, obtaining a specified attribute style of the input box; Modifying the specified attribute style based on the keyboard height so that the input box is located above the target keyboard; If the status bar attribute information is an immersive status bar, calculating an adjustment position amount corresponding to the input box based on the keyboard height; The position of the input box is adjusted accordingly based on the adjustment position amount.
5. The method for processing the position of a page input box according to claim 1, characterized in that: The step of obtaining the target operating system information corresponding to the target page specifically includes: Obtaining a user agent string of a browser corresponding to the target page; Performing data analysis on the user agent character string to extract target keywords related to the operating system; The target operating system information corresponding to the target page is determined based on the target keyword.
6. The method for processing the position of a page input box according to claim 1, characterized in that: After the step of determining whether the target operating system information is an Android system, the method further includes: If the target operating system information is an iOS system, a specified callback function corresponding to the specified event is called, and a delay setting is performed on the specified callback function based on a preset delay function and delay time; After the keyboard pop-up event corresponding to the target page is monitored based on the specified callback function and the delay ends, determining whether the target page is in a pop-up state; If the target page is not in the raised state, obtaining the target keyboard height of the target keyboard; Obtaining a target positioning attribute of the input box; The target positioning attribute is set to the target keyboard height to complete the position adjustment process for the input box of the target page.
7. The method for processing the position of a page input box according to claim 6, characterized in that: The step of determining whether the target page is in a lifted state specifically includes: Call the target property of the preset visual viewport interface; Based on the target attribute, obtaining an offset of the top of the visual viewport in the target page relative to the layout viewport; Determining whether the offset is greater than a preset offset threshold; If so, determining that the target page is in a lifted state; If not, it is determined that the target page is not in a lifted state.
8. A device for processing the position of a page input box, characterized in that: include: A first acquisition module, used for acquiring target operating system information corresponding to the target page after the target page is loaded; A first determination module is used to determine whether the target operating system information is an Android system; A second acquisition module, configured to acquire status bar attribute information corresponding to the target page; A monitoring module, configured to monitor a keyboard pop-up event corresponding to the target page based on a target monitoring strategy corresponding to the status bar attribute information; A third acquisition module is used to acquire the keyboard height corresponding to the target keyboard in the target page based on a preset keyboard height calculation strategy if a keyboard pop-up event occurs on the target page; A fourth acquisition module, used to acquire an input box adjustment strategy corresponding to the status bar attribute information; The adjustment module is used to adjust the position of the input box of the target page based on the input box adjustment strategy and the keyboard height.
9. A computer device, characterized in that: The method comprises a memory and a processor, wherein the memory stores computer-readable instructions, and the processor implements the steps of the method for processing the position of a page input box as claimed in any one of claims 1 to 7 when executing the computer-readable instructions.
10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-readable instructions, and when the computer-readable instructions are executed by a processor, the steps of the method for processing the position of a page input box according to any one of claims 1 to 7 are implemented.
Citation Information
Patent Citations
Text box display method and device, computer equipment and storage medium
CN111381765A
Keyboard display method, folding screen equipment and computer readable storage medium
CN115495003A
