简体   繁体   中英

Pass data between pages on IOS

I have been doing research but I just cant find working solution. I am working on one website where I have slide carousel with 3 slides in home page. 2 of slides linking to same activity.html just pointing to different 'tabs'/'cards'. One slide from home page opens activity 'tab'/'card' on activities.html page, another opens consultation 'tab'/'card' using localStorage. On PC works just fine, but the problem is:

This does not work on my iPhone. After my research I found out that is the private.. whatever thing.. problem on safari. I have tried to use store.js, memorystorage.js, Coockies.js and few other. Non of them helped. Tried using querystring and hash but problem is these strings remains in url. I desperate need to find a solution for this annoying problem.

Logic I using is simple: On slide button press I set item into localStorage on main js file. In the activities.html I have small script where I get item from localStorage and then check which of two item is in localstorage. If its travel, so open travel 'tab'/'card' if its consultation, etc, you get the idea... This script sits in the main js file:

(function() {
const travelSlideBtn = $("a#slide2-btn");
const consultationSlide = $("a#slide3-btn");

function setTravelSlide() {
  localStorage.setItem("travelSlide", "travelSlide");
}
function setConsultationSlide() {
  localStorage.setItem("consultationSlide", "consultationSlide");
}

//Events
travelSlideBtn.on('click', setTravelSlide);
consultationSlide.on('click', setConsultationSlide)

}());

And that script sits in activities.html page:

let travelSlide = localStorage.getItem("travelSlide");
let consultationSlide = localStorage.getItem("consultationSlide");
const thumbnail = $(".thumbnail");
const travelThumbnail = $(".travel-thumbnail");
const consultationThumbnail = $(".consultation-thumbnail");
let thumbnailOffsetTop = thumbnail.offset().top - $("#main-header").height();

if ('localStorage' in window && window.localStorage !== null) {
  if (travelSlide == "travelSlide") {
    TweenMax.to(window, 1, {scrollTo:{y:thumbnailOffsetTop, ease: Power4.easeOut}, onComplete:function(){
      travelThumbnail.click();
      localStorage.removeItem("travelSlide");
    }});
  }
  if (consultationSlide == "consultationSlide") {
    TweenMax.to(window, 1, {scrollTo:{y:thumbnailOffsetTop, ease: Power4.easeOut}, onComplete:function(){
      localStorage.removeItem("consultationSlide");
      consultationThumbnail.click();
    }});
  }
}else{
  console.log('cannot use');
}

Well I found the problem. I was looking wrong things. The problem was not with localStorage. GSAP was causing problem here:

TweenMax.to(window, 1, {scrollTo:{y:thumbnailOffsetTop, ease: Power4.easeOut, autoKill:false}, onComplete:function(){
        localStorage.removeItem("consultationSlide");
        consultationThumbnail.click();
      }});

When I set autoKill to false, everything started to work. Heh, wasted so much time looking for wrong things :)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM