I was building a javascript-powered zip-code registration web page, with a numeric display which would be used to enter the zip-codes of guests at a company grand social function, to later determine where they came from. The screenshot below is what I came up with:
Your basic numeric display with digits, a 'clear' button and a 'undo latest' button. Upon entering a 4-digit zip, the 'display' automatically clears, ready for a new one.
But the app was to run exclusively as a web-app within an iPad, and what I found was that the onClick handlers I'd attributed to the buttons, which are actually DIVs, were slow to trigger, on both my version 1 and version 2 iPad. A bit of googling suggested I went with the touchstart event instead; which worked beautifully, the javascript associated with the events executed quickly and beautifully.
So to recap, in the $(document).ready(function () -section I did this:
$('.digit').bind("touchstart", function () {
var clickedValue = this.getAttribute("value");
// do something with the button's digit value here
}
... where '.digit' corresponds with the class I give my DIVs:
9
Give me a shout if you want the code, it's a Visual Studio 2010 c# web application. HTH someone in a similar bind.
