What To Do When Jquery's Data-rel="Back" Doesn't Works On iOS

In this blog, you will learn about the solution to the problem with the data-rel="back" of jQuery Mobile in iOS.

New to jQuery?

Learn about the basics of jQuery by reading"

1. jQuery Library
2. jQuery Syntax
3. jQuery Events

I was unaware of the fact that jQuery's data-rel="back", which makes our navigation easier, can create a big problem on iOS, until I faced it. It works very smoothly on Android devices but stops working on iPhones.

 

Then, how to implement data-rel="back" on iPhones? Initially, let us understand how data-rel="back" of jQuery works and data-rel is an attribute of an anchor tag. It is a feature of jQuery Mobile. 

 

Suppose, I want to implement a back button for which I simply need to write this attribute in an anchor tag. Writing data-rel="back" will make sure that whenever the link is clicked, the link behaves like a back button and the default href of the anchor tag is ignored.

 

Starting next time, when you need a back button, you can include jQuery mobile library in your code and simply write it.

<a data-rel="back"> Back </a>

This works absolutely fine in Android devices. Coming to iOS, let's look at the alternative, which worked for me. Simply replace the data-rel="back" with onclick event.

<a onclick="history.go(-1);"> Back </a>