Set keyboard to stay open even on "go" press with html5/javascript? - javascript

I'm building a small html5 web-app to hone my html5 skills. I've built the project and it works pretty good, but I want to enable some mobile functionality which should make it even cooler! One of the annoyances of using the site on mobile is that whenever you press the "go" button on the android keyboard after entering data into a textbox, it hides its self, despite the fact that in javascript I've specified that the textbox still has focus. Is there a way to explicitly tell the android browser to keep the keyboard open?
Thanks,
John

I think this is beyond the realms of JS - The keyboard is part of android, and thus (I assume) would be up to the browser to decide whether the keyboard stays or not - how would you cope for different browsers running across android?
Because I would assume they're not all running Webkit (Firefox mobile?).
So I think the answer is it can't be done :(

Related

How to clear an IME keyboard cache

I'm trying to manage and replicate the input coming in from a keyboard using JavaScript. This is trivial except when it comes to IME style keyboards that are the default for Android phones and Chrome OS tablets (or foreign language input). While I've mostly been successful in replicating the input generated from composition events there is one major snag: the keyboard cache.
On Android and Chrome OS when a user is typing into a text area the keyboard remembers what was recently typed and will use it to prefill the composition when the user backspaces. This is very detrimental to my objectives as it makes it hard for me to replicate the behavior without having to maintain my own version of the cache. I've been able to clear the cache on Android by using textarea.blur(); textarea.focus(); but this is not ideal and doesn't work on Chrome OS. Does anyone know what can be done about the keyboard cache from a JavaScript perspective?

Disable Chrome mobile's "tap to search" on a web app

I would like to be able to disable, through JavaScript or some sort of HTML meta-tag, the tap-to-search/touch-to-search feature found on mobile Chrome which shows a banner at the bottom of the browser every time the user long presses/taps on a word in any text paragraph.
This Chrome feature is a problem for me because this contextual banner completely covers the toolbar in the web app that I am developing, which is fixed at the bottom of the page.
I've only found this question from 2015 which references this Google Developers article (also from 2015), but the proposed solutions do not seem to work anymore except CSS "user-select: none"; unfortunately, disabling user selection is not a solution for me since user selection is required for my web app to work.
I have also tried setting event.preventDefault() when the "oncontextmenu" event fires, which does disable the search toolbar when the user taps on a word, but not when a user long presses on a word, as far as I have experienced.
So far the only partial "solution" that has worked for me has been to install the web app: as an installed PWA, tap-to-search does not somehow trigger. It still annoys me a lot that I would have to basically beg my potential users to install the web app on mobile.
I also know that the user can manually disable this feature globally in the Chrome Flags, but this is, I imagine, really annoying for a potential user as well.
Is there anything I am missing here? Do you know of any way to prevent tap-to-search from firing on a long press?
Adding the attribute tabindex="-1" to the <body> tag works for me.
As of 2021, it isn't possible to disable touch-to-search (when this is triggered by a long-press for text selection) in chrome mobile. The Google Developers article is apparently concerned only with touch-to-search triggered through a tap gesture.
Quoting donnd, from bugs.chromium.org:
Regarding #2 -- developer control: The 2015 article that you mentioned (https://developers.google.com/web/updates/2015/10/tap-to-search) focuses on triggering through the tap gesture. As you correctly point out, it does not address the long-press gesture triggering. Touch to Search responds to both tap and long-press but treats them differently. As I'm sure you know, the long-press gesture activates a whole set of features which can include copy, translation, smart text selection, and Web Search. A site developer can markup their page text as non-selectable in order to disable the long-press gesture entirely, but currently there's no way to disable only the Touch to Search response to long pressing. If you'd like to work with us to add such a feature, let us know and we'll file a separate feature request.

Creating mobile controls for Javascript app (keyboard sim)

There's a game in Javascript which used the keyboard for controls to move the player. I'm wondering how you'd go about converting this to a mobile version.
I would need to allow the user to press graphic buttons on their phone to essentially simulate keyboard presses (and releases) and utilize multi-touch as well.
Any ideas on the best way to go about this? I have a few ideas, but I'd hate to start trying to implement one and find out it doesn't work.

How to detect the presence of a hardware back button from a webapp with javascript

I've seen multiple questions regarding how to check the presence of a back button in Android, but they all seem to be geared towards apps in Android, which I don't believe would help here.
I want to determine the need to show a back button in a webapp that will be run across multiple OS's, and I know with javascript you can check what OS the device is, which answers the need to show or not show a back button for iOS, or Windows Phone, but with Android, since there's many different button set ups, I would like to be able to check the presence of either a software back button (like an LG, OnePlus One or something) or a hardware back button you would see on most other devices with hardware buttons. I can't seem to find an answer in my searches, and if it's not possible, that's fine, I just want to ask and be sure. Again, any answers need to be relevant to javascript solutions. If there are any useful libraries or tools I can integrate in with the javascript, (i.e. something in angular, jquery, etc. then I'm happy to entertain those solutions as well).

Why does Javascript pause when long pressing on an Android or iOS device?

When I long press or scroll on the screen of an Android or iOS device, the Javascript running in the webview pauses. How can I keep js running, and additionally, why does js pause in this case?
This post has a similar question/answer, I believe it is purely a performance optimisation, as scrolling will require the browser to redraw/paint the DOM: This will take alot of resources. In regards to the long press, this may be related to the browser waiting to understand what the wants to do next, i.e. selecting an area to copy/paste or triggering the browsers context menu.

Categories