JQuery is very slow on the iPad

Question

I have jQuery that I am working on, on a test case that we are viewing, and it slowly runs extremely on our iPad 2.

It responds quickly and quickly to our desktops and laptops. I tried to remove all selectors (where possible) and use stored links instead, which helped a little.

Before this change was http://jsfiddle.net/EEGgv/5/ , and after http://jsfiddle.net/EEGgv/6/

Here is the current jQuery code:

$().ready(function () { var $varSelected = 'undefined'; var $this = 'undefined'; var varPrev = ''; var varNew = ''; $('.btn').click(function () { $this = $(this); if ($varSelected !== 'undefined') { // Get previous value varPrev = $varSelected.text(); // Find value we're trying to add varAdding = $this.attr('value'); if (varAdding == 'Clr') { varNew = ''; } else { varNew = varPrev + varAdding; } // Write new value $varSelected.text(varNew); } }); $('.qtyBox').click(function () { $this = $(this); // Check if we've previously had a selected box if ($varSelected === 'undefined') { // Didn't have one before -- nothing special } else { // Had one selected. We need to unselect it. $varSelected.removeClass('Selected'); } // Select the one we have now $varSelected = $this; // Add formatting $this.addClass('Selected'); // Clear value varNew = ''; $this.text(varNew); }); }); 

I have a version / 5 / version (pre-references) loaded in http://test.projectdavis.com/test.html , while / 6 / versoin (links) are loaded in http: //test.projectdavis .com / test2.html .

Does anyone have an understanding?

thanks

Answer 1

I was able to test your page on my iPad 2. The input delay seems to be related to the delay of the mobile call event, when events with a mouse click start after 0.3 seconds in mobile browsers ( https://developers.google.com/mobile / articles / fast_buttons? hl = de-DE .). This delay is that the browser can listen for a double click. There are four additional event handlers that the mobile browser that interests you is clickend . The clickend event is fired when the user lifts a finger from the screen.

Below is the code from MDN https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events/Touch_events

 var el = document.getElementsById("MyButtonID"); el.addEventListener("touchend", handleEnd, false);