Prevent click-Event on input field

Question

I am developing a PhoneGap-App for iPad. On one screen you have to fill out a form with about 20 textfields. As input-fields only react to the click-event (which have this not long but yet annoying delay) I tried the following:

$('input[type="text"], input[type=number], input[type=date], input[type="tel"], input[type=password], input[type="email"], input[type="url"], textarea, select').live("touchend", function(e) {
    if(!swipe) {
        $(this).focus();
    }
    swipe = false;
    return false;
});

(I check for swipe in the touchmove event)

This works, but now I want to prevent the original click event on the inputs. The problem is, when I activate an input-field with the .focus() method, the keyboard pops up and slides the page a little bit up AND then the click event gets fired and activates another input-field a little bit below my desired input.

For preventing click I already tried:

$('input[type="text"], input[type=number], input[type=date], input[type="tel"], input[type=password], input[type="email"], input[type="url"], textarea, select').live("click", function(e) {
    return false;
});

but this also doesn't work :(

Is there another trick to activate input-fields immediately after I touched it without any delay?

Solution 1

you can try this

 $('input, textarea, select').click(function(event) {
    event.preventDefault();
 });

Solution 2

You need to use preventDefault to prevent the default action:

  $('input[type="text"], input[type=number], input[type=date], input[type="tel"], input[type=password], input[type="email"], input[type="url"], textarea, select').live("click", function(e) {
        e.preventDefault();
    });

Documentation : http://api.jquery.com/event.preventDefault/

Comments

[yasaricli]

append new element not click function :) is live("click") change.