jQuery Mobile - Bad tap behavior on form select
I am building a Rails 3.03 application using jQuery Mobile 1.0a3 (& jQuery 1.5) to render mobile views. I look at it in Safari on an old 1st-generation iPhone.
I have a collection_select in one of the forms. This renders a touchable control that looks like a button, which opens a pop-up select element with the list, so the user can select the option/value. So far, so good.
The problem…
If I tap the rendered button with just a quick tap, the select list will pop-up then immediately disappear (with no option/value selected). Of course, this makes the UI look broken or hard to use. (I wonder if it might be a double-tap or ghost-tap problem.)
The good news is that if I press the rendered button for 500ms or so, then release, the select list will pop-up and remain so the user can make a selection (the behavior I want).
I am not doing anything custom with Javascript, just using jQuery Mobile 'out of the box'. I am not sure if I need to do something with touch event handlers, defaults, or what. Maybe it is my old phone…
Any ideas?
Update
I received this helpful response from Antonio Alonso at Embarcadero Technologies which solved my problem. Thanks Antonio!
"I'll recommend you to upgrade to the latest release 1.0a4.1, with jQuery 1.5.2. Remember to upgrade all the files, javascript, css and images. And go through the documentation again because some things have changed. Now there are virtual events like vclick.
http://jquerymobile.com/blog/2011/03/31/jquery-mobile-al开发者_Go百科pha-4-released/
http://jquerymobile.com/blog/2011/04/07/jquery-alpha-4-1-maintenance-release/
http://jquerymobile.com/demos/1.0a4.1/
I don´t know if it will solve your issue, but fixes a lot of bugs from the previous version."
The first thing to try is to upgrade to jQuery Mobile 1.0a4.1, it includes a better event handling for the click / tap events to address exactly this sort of issue.
It also includes a new virtual event 'vclick' which solved all problems I had with tapping buttons quickly.
Good luck. :)
精彩评论