3

I'm using the touchendevent to prevent ios from requiring two touches to fire href links. This works fine however it is firing the links unintentionally when scrolling.

I know that the the solution is to implement the touchstart to see if there is movement, but I'm a jquery novice and I'm not sure how apply this.

Here is the touchendcode 

$('a').on('touchend', function(e) {
var el = $(this);
var link = el.attr('href');
window.location = link;
});

Hope someone can help.

Thanks

Corey Harrison
  • 273
  • 1
  • 9

3 Answers3

5

Ok this is what is working for me to solve this using code from this post 

var dragging = false;
$("a").on("touchmove", function(){
  dragging = true;
});

$("a").on("touchend", function(e){
  if (dragging){
e.preventDefault();
}
else {var el = $(this);
var link = el.attr('href');
window.location = link;
}    

});

$("a").on("touchstart", function(){
dragging = false;
});

This works for me.

Community
  • 1
  • 1
Corey Harrison
  • 273
  • 1
  • 9
  • Nice solution! Just remember that jQuery doesn't always simply things. In the `else` statement on `touchend` you can do the redirect like this: `window.location = this.href;` – ToXic73 Oct 06 '15 at 10:30
0

Use preventDefault:

$('a').on('touchend', function(e) {
e.preventDefault();
var el = $(this);
var link = el.attr('href');
window.location = link;
});
Bhojendra Rauniyar
  • 83,432
  • 35
  • 168
  • 231
  • That doesn't work I'm afraid. It still fires the link unintentionally if you touch a link when scrolling. You can see here: http://dev2014.rab.co.uk/ – Corey Harrison Mar 17 '14 at 10:59
  • how about touchstart? just replace touchend to touchstart. – Bhojendra Rauniyar Mar 17 '14 at 11:02
  • No touchstart fires the link immediately when clicked where as touchend fires the link after the scroll has stopped. I'm guessing there needs to be an if statement that checks if there has been movement and stops the link from firing? – Corey Harrison Mar 17 '14 at 11:11
  • You need to detect if they are dragging. You can do this by setting a flag on `touchstart`. Credit to @CoreyHarrison – ToXic73 Oct 06 '15 at 10:33
0

For me this one works

$('a').on('click touchend', function(e) {
    var el = $(this);
    var link = el.attr('href');
    if (link !== undefined && link !== '') {
        window.location = link;
    }
});
mmacin
  • 111
  • 2
  • 11