Hello,

I'm very new to JQuery and had a big problem arise. I developed a virtual number pad for an online sign-in prompt to be used on an iPad; however, I noticed a significant delay in the iPads click event, creating terrible lag between when you press a number key and when the event (the number being inserted in the text field) actually happens.

Within a browser, all works correctly (no delay). In an iPad, there's a problem.

From my research I have found:

http://cubiq.org/remove-onclick-dela...kit-for-iphone

http://stackoverflow.com/questions/4...-is-it-possibl

Seems like I'll need to do some raw Javascript?

The problem is, as mentioned before, I'm extremely new to Javascript/Jquery in general and I don't know how to implement the solutions provided in the links above.

Can anyone walk me through this?

Right now my file structure is (as is relevant to this case):

index.html - containing:

HTML Code:
<input type="text" name="anumber" placeholder="number" id="a_number"/>
          <!-- Virtual Numpad -->
          <table id="numpad">
             <tr>
                <td><div id="one" class="num_button blue">1</div></td>
                <td><div id="two" class="num_button blue ">2</div></td>
                <td><div id="three" class="num_button blue">3</div></td>
             </tr>
             <tr>
                <td><div id="four" class="num_button magenta">4</div></td>
                <td><div id="five" class="num_button magenta">5</div></td>
                <td><div id="six" class="num_button magenta">6</div></td>
             </tr>
             <tr>
                <td><div id="seven" class="num_button orange">7</div></td>
                <td><div id="eight" class="num_button orange">8</div></td>
                <td><div id="nine" class="num_button orange">9</div></td>
             </tr>
             <tr>
                <td><div id="guest_button" class="num_button yellow">Guest</div></td>
                <td><div id="zero" class="num_button red">0</div></td>
                <td><div id="anum_button" class="num_button green">Submit</div></td>
             </tr>
          </table>
script.js - containing:
Right now, I just have some simple Jquery, that appends a '1' (or whatever number is pressed) to the current string in the main text field.

Code JavaScript:
$('#one').click(function() {  
  var test = $("#a_number").val()+1; 
  $("#a_number").val(test);
});

Thank you so much in advance for your time!!

You can view my page here: http://elite.tamucc.edu/sundae/