Seeking assistance with transferring jQuery to regular JavaScript and installing on the home screen of an Apple device

Question

Seeking assistance with transferring jQuery to regular JavaScript and installing on the home screen of an Apple device

Dealing with the issue of iPhone "Bookmark to Homescreen" removing cookies and sessions, I have come up with a jQuery solution. Learn more about this problem here.

In essence, by using JavaScript to create add to homescreen kit launch links, you can avoid being redirected to Safari, which typically clears any cookie information stored.

<script>

$(function(){
   $('a[href]').click(function(e){
       e.preventDefault();
       document.location.href = $(this).attr('href');
       return false;
   }) ;
});

</script>

However, as I prefer not to use jQuery on this particular site, I am seeking assistance in developing a pure JavaScript solution. This script should only need to be compatible with Safari, as we are primarily targeting that platform. Additionally, having a method to detect the Safari browser would be beneficial, since other platforms do not support the add to homescreen feature we are focusing on.

javascript

Answer 1

Answer №1

let links = document.getElementsByTagName('a');
for (let i = 0; i < links.length; i++) {
   links[i].onclick = function(){
       alert("contact!");
       e.preventDefault();
       document.location.href = this.href;
       return false;
   }
}

Not tested yet, but it should work.

Edit

Alright, finally tested the code.

http://jsfiddle.net/7q6xx/2

Edit 2

Optimized to use the links collection as per RobG's suggestion.

Answer 2

let links = document.getElementsByTagName('a');
for (let i = 0; i < links.length; i++) {
   links[i].onclick = function(){
       alert("contact!");
       e.preventDefault();
       document.location.href = this.href;
       return false;
   }
}

Not tested yet, but it should work.

Edit

Alright, finally tested the code.

http://jsfiddle.net/7q6xx/2

Edit 2

Optimized to use the links collection as per RobG's suggestion.

Answer 3

Answer №2

Regarding Joseph's response, here is an alternative approach using the links collection:

let links = document.links;
for (let i=0; i<links.length; i++) {
  links[i].onclick = function(){
    e.preventDefault();
    location.href = this.href;
    return false;
  }
}

Don't forget to show him some appreciation.

Answer 4

Regarding Joseph's response, here is an alternative approach using the links collection:

let links = document.links;
for (let i=0; i<links.length; i++) {
  links[i].onclick = function(){
    e.preventDefault();
    location.href = this.href;
    return false;
  }
}

Don't forget to show him some appreciation.

Seeking assistance with transferring jQuery to regular JavaScript and installing on the home screen of an Apple device

Answer №1

Edit

Edit 2

Answer №2

Similar questions

Problems with Vuex getter reactivity when used in conjunction with Vue router

vee-validate - Standalone form validation with distinct procedures

Transforming items into an array

Issue arises after injecting HTML element into the DOM due to memory constraints and display inconsistencies

Issue: angular2-cookies/core.js file could not be found in my Angular2 ASP.NET Core application

Can a file be transferred from an Electron application to an Express server by supplying the file path?

dynamic image size based on mobile device orientation

What is the method for inserting a new <p> tag whenever a user sends a new message in ReactJS?

Tips for ensuring that your modal functions properly with an image tag within a figure tag

What is the best method in ASP.NET Boilerplate for retrieving JSON data?

Is it possible to validate an email domain using node.js? For example, checking if gmail.com is a valid email domain, and ensuring that users do not enter incorrect variations such as egmail.com

Placing a hyperlink within template strings

Using AJAX to retrieve a specific JSON object from an array of JSON data

What are some superior methods for determining the validity of a control in JavaScript?

The hyperlinks in the navigation bar are leading me to incorrect destinations

Is it possible to remove individual items from a FlatList by clicking on them and updating the state?

Arrange my Firebase Angular users based on a specific value, encountering an error stating "sort is not a function

Align pictures in the middle of two divisions within a segment

show the attributes of an item contained within an array of objects

Different ways to use jquery to move to the top of an overflow div