Differences

This shows you the differences between two versions of the page.

@@ Line 1: / Line 1: @@
+====== Obstacles and traps of JQuery ======
+Celebration of Christmas and New Year have ended. Its time to back to work on projects.\\
+Did some progress on **[[project:spot-in:start|Spot-In]]**'s server backend. Begun to update front end. I would like to allow user to delete his own report within few minutes after posting. It's quite ordinal in mobile UI((user interface)) that taphold((click and hold for second)) event brings additional menu for touched item. I would like to use it to delete record.\\
+Everything looks good till you try. Attached tap and taphold events for items and problems flow out:
+  * If you taphold, tap event is executed
+  * If you try to scroll down- taphold event is executed. As mentioned is previous problem, taphold is followed with tap.
+Well, I could deal with tap and taphold problem if where would be no need to scroll down. This ListViews requirement was my traps. Searched whole web. I've tried various hakish ways of achieving what is needed and each time I've banged head into wall.
+Finally, after a week I've found one simple and interesting solution, that really works. Swipe (scroll), taphold work perfectly. Solution is quite simple: taphold threshold and swipe duration threshold must differentiate at least 1ms(millisecond). And these thresholds mus be set before loading JQuery mobile library. Script should look like so:\\
+<code html>
+<script type="text/javascript" charset="utf-8" src="jquery.min.js"></script>
+<script type="text/javascript">
+    $(document).bind("mobileinit", function () {
+        $.event.special.tap.tapholdThreshold = 1000,
+        $.event.special.swipe.durationThreshold = 999;
+    });
+</script>
+<script type="text/javascript" charset="utf-8" src="jquery.mobile.min.js"></script>
+</code>
+One problem solved, but one left: how to prevent tap after taphold. I have tried everything what I came up with: various settings, hakish event handling and so on. This [[https://github.com/jquery/jquery-mobile/issues/3803|bug is registered]] in official jQuery bug tracked. Resolution- "wont fix" 8-o\\
+And suddenly idea strike my head: unbind tap event on taphold and rebind it later. Little bit lame, but ir works :)
+<code javascript>
+$("#object").on('taphold', function(e){
+	$(this).off("click");
+	//do whatever is needed
+	setTimeout(function(){		//after 3 seconds return click event, as it was removed
+		$(this).on("click", function(){
+			// TAP event processing
+		})
+	},3000);
+})
+</code>
+Looks like these two snippets let scroll, taphold and tap events to behave friendly without teasing each other :-) \\
+Now I can continue to work on next version of spot-in for android.
+P.S. I've found a remote Mac service. But about this later, till I be able to test it.
+{{tag> jquery tap taphold }}
+~~DISCUSSION~~