Since the on-screen keyboard takes a lot of space on mobile devices, I would like to change the layout of a page of my website when the user selects a field to enter some information, and cancel these changes when the user leaves the field. Basically I want to hide some elements to save some space. I've tried to use the JavaScript "focusout" and "blur" events, but they don't work properly: a user might click on an area of the page, which would make the on-screen keyboard disappear, but the cursor would remain in the field and the "focusout"/"blur" event wouldn't be triggered. Is there any way to fix this?
Thanks
Related
I'm trying to set focus and place the cursor in a text box and bring up the keyboard automatically when I pop up a modal dialog. I don't want the user to click anywhere. This works fine everywhere except on mobile Safari.
I tried focus(), touchstart, timeouts, direct and indirect event generation, etc. with jQuery with no luck. Does anyone have any ideas?
Try to generate a click event after setting the focus
I have a page intended for desktop and mobile that has buttons allowing the user to touch and hold them to make adjustments. This jsfiddle illustrates the behaviour.
The problem is that on my Android phone, the div acting as a button gets highlighted with focus. It will then no longer respond to touch events until the focus has been taken away from it (by pressing another button) and going back to it.
Is is possible to clear or disable the focus of elements?
Would e.preventDefault be an option?
you can try $("#id").blur(), or simply focus on something else like $("#otherid").focus()
I have a <textarea> inside of an Ext.list in a web application that I'm viewing on iOS in a UIWebView.
When the <textarea> is focused and the keyboard is up, if I click anywhere in the UIWebView, then the <textarea> blurs and the keyboard moves down. Again, mobile safari does not do this, leading me to believe that this is behavior produced by Sencha Touch, and I would like to get rid of it. I'd like the user to be able to interace with web content while the keyboard is up.
I registered to event listeners - ontouchstart on the ext.list, and onbluron the <textarea>. The fact that, when the <textarea> is focused, if I click on ext.list, the ontouchstart fires before the onblur, I am lead to believe that UIWebView is not blurring the field, but something in Sencha Touch definitely seems to be also registering some sort of touch event and blurring it.
Essentially, I'd like to be able to remove whatever events sencha automatically installs to blur things, and handle it all myself. Sometimes I want to blur, sometimes I don't, depending on what is clicked.
So, what can I do?
I don't actually want to do this; I'm just curious if it's possible. Apparently there are some hacky ways to check whether an on-screen keyboard is visible; however, I'm wondering if you can actually dismiss the keyboard using JavaScript.
That is, if you have a form that the user is filling out, and they enter an input field so the keyboard appears, is there any way to make it disappear?
You can pass focus to an element in javascript as such:
element.focus()
I'm doing that with a input text box and it works fine. The input box gets focus and the cursor is in it.
We now want to also trigger the soft keyboard on touch devices. By default, putting focus on a field via JS will move the cursor into the field, but won't open the keyboard until the user physically taps on the field.
Is there a way to trigger a touch event (I'm guessing touchstart) akin to this:
element.touchstart()
That doesn't work, but hoping there is some method for this...
BTW, this is primarily for webkit. We're trying to get this working on an iPhone and BB Torch.
The event is ontouchstart instead of touchstart