Javascript AJAX Click event sometimes not working in Android native browser - javascript

While testing my application with different devices I found one weird problem in android browser in android phones.
I have almost same design for PC and and mobile, in PC and in iPhone and mobile Chrome browser its working fine.
<a type="cart_type" onclick="ajax_submit_for_new_order_session(81, true);
return false;" id="81" href="javascript:void(0)">
<i class="icon-plus-sign"></i></a>
Above is the code for my anchor tag, When I click on this anchor tag sometimes its calling the specified method and sometimes its not.
I am totally confused and scratching my head from so long for finding the issue but no luck.
Is there any problem with onclick in mobile devices?

Solved the issue by updating the jQuery version to 1.11 earlier I am using 1.8
instead of using onclick now I am using touchstart or mousedown
this Solves the problem in all devices..
Its not problem with the code.. the delay taking by the browser is sometimes about 5 sec.

Related

Ionic Framework react Deeplinking with hashlinks and IDs

How is it possible with Ionic Framework/react to deeplink to a certain position marked with an ID on a page with long content with a hashlink?
For example on tab2 I have a long text and some positions are marked with IDs
<p id="foo"></p>
Now I want to link from another Tab to this one on exactly this position in the text
<Link to"/route#foo"><IonButton>Link to #foo</IonButton></Link>
With normal Link from react-router-dom it`s not possible, so I tried “react-router-hashlink” and it
worked in the browser and on android, but NOT on iOS and mobile devices.
<HashLink to"/route#foo"><IonButton>Link to #foo</IonButton></HashLink>
So I found out, it is the same problem on MacOS Safari (Firefox and Chrome are working) and on every mobile browser on iOS.
And: when I am testing it on a testapp, sometimes its working and sometimes not. On Safari mobile maybe every 10th try its working.
What I`m doing wrong here?
Thanks for answering.

Mobile Android Chrome not working great with HTML5 and CREATEJS - freezing issues

I have developed an app using HTML5 and CREATEJS. I am encountering some issues that I cannot find a solution, for weeks. I hope someone can help.
1)On Android Google Chrome there is a problem that appears when I simply click anywhere on the screen: the FPS drops and any animation that is playing freezes for the duration of my touch. The problem is only in Mobile Chrome browser, on Android. It does not exist in other mobile browsers, neither in iPhone, neither in Safari, Firefox, etc.
I created a simple apk using webview and it doesn't have the problem either. So for some reason, the problem is only in mobile android chrome.
The code is optimized at maximum. 2 months ago we used only 1 canvas, but now we use multiple canvases and we have less animations in each canvas running everytime. While in android firefox it works perfect, but in android chrome it freezes for a single click.
I tried to disable stagemousedown/up events, because they are being triggered when I simply click anywhere in the stage. This didn't fix the problem or it is possible that there are some hidden stagetouch events that I don't know how to disable.
2)On Android Google Chrome and iPhone6 Safari, when I click the SPIN button, the game starts the SPIN, but with a delay of at least 1.5 seconds, but there is no such delay added with intention inside the code. On PC any browser, Android/iOS Mobile Firefox, this works perfect, no delay. In iOS Safari iPhone8 again it works perfect.
I created a simple apk using webview and it doesn't have this problem either. So for some reason, the problem is only in mobile android chrome.
UPDATE 11/10/19: Issue 2 has been solved by reducing canvas size and removing all shadow effects which consumed a lot of memory. Issue 1 still remains unsolved with absolutely no ideas left to try out. Any help is appreciated.
My project is 99% completed except these 2 issues. I am hoping to be able to fix them, because I really do not want to throw away months of work and switch to other javascript library for gaming, that doesn't have the problem, like PIXIJS.
I tried with RAF and RAF_SYNCHED, but still no improvement in any scenario.
Stage.update() is required for any animation. Having them on ticker is the reason why its getting slower.
To see the problem in action, please open this URL: http://www.nevergone.biz/DEMO_CODE/index.html
How to test: Open the link above in Android Google Chrome portrait mode and then click SPIN. During SPIN click above the game canvas or anywhere. Notice that everything freezes.
The code was extracted only for testing these issues, so after a few spins it may freeze. I will fix this tomorrow, but I hope someone can give some ideas for solving the problem.
Problem #1 is apparently isolated on some older devices that use Android Google Chrome. The problem is somehow caused by CREATEJS using too many listeners on the stagedown event. I am currently waiting for the developer of the framework to give an answer or for Chrome to receive a serious update.
Problem #2 was fixed by removing all text-shadow CSS effects which apparently were consuming a lot of memory.
cache might work.
var testShape=new createjs.Shape();
testShape.graphics.beginFill("red").rect(0,0,100,100);
testShape.cache(0,0,100,100);
stage.addChild(testShape);
// If you make changes and want to refresh the cache
testShape.updateCache()

iOS 3 - Click event on mobile safari

When I load my website on an old iPod Touch running iOS 3, my javascript (jQuery) doesn't work. I have a div that when clicked or tapped should toggle the display property of another div. It works on all other devices that I've tried it on, but all of them are newer. Here is what I'm working with:
$(document).ready(function () {
$("#mymenu").click(function(){
$("#listNav").toggle();
});
});
and
<a id="mymenu" class="clickable" onclick="" ><div class="clickable"><p>Menu ▼</p></div></a>
Some suggested creating a class that added cursor: pointer, which I have, but it doesn't help. I've also tried adding an empty onclick='' but that didn't help either.
I've also tried doing so with .on("touchstart"...) instead of .click, and even tried using a button instead of a div.
I wouldn't care for ensuring this backward compatibility but the problem is that this feature isn't working on the client's iPhone, so I HAVE to get it right.
jQuery only supports iOS3 up to version 1.12, so after that things could break.
Rather than downgrading your jQuery verision I would highly recommend telling the client to upgrade their equipment to something more modern. If you must support it, then use an older version of jQuery.

PhotoSwipe not working on mobile

I have integrated PhotoSwipe 4 on my website. It works well on a desktop machine when using a mouse, but when I open on mobile nothing works, and I can scroll down (it should close like that). Any ideas why this happens?
Here's a test page with this issue:
http://d9281484.u62.c14.ixinstant.com/events/first-event-2014
Most likely it's caused by mCustomScrollbar script that you're using, which stops the propagation of all touch events on mobile.

Custom jQuery Slider does not work on iOS 7 Safari

I am working on a mobile site, my first, and I am facing strange problems. I have created a custom jQuery slider with left and right buttons. I have tried it on my Android's own browser, Firefox and Chrome for Android. It works fine, as it is supposed to.
When I gave the work to my client he said it doesn't work on iPhone for which it is originaly intended. I was confused as how this is possible, as it worked flawlessly on my Android. So I asked my friend for his iPhone 4S with iOS7 and opened up the site. To my surprise, the slider did not work. I took out my phone and opened it on my Firefox, it worked!
Why is this so? If it is working on Android, shouldn't it be working on iOS too? And how can I solve it?
Regards
I came to know why this happens. By default, iOS Safari doesn't allow everything to be "clickable". This means you need to make it cursor: pointer via CSS to make it "clickable".
I have got my answer from here: This link tell is why this happens. Read it!
Regards

Categories