クリックしたメニューに基づくHTML5ホームページ

Question

私はホームページにサッカー、バスケットボール、ネットボールなどのさまざまなスポーツへのリンクがある非常に単純なスポーツウェブサイトを持っています。私が望むのは、ユーザーがフットボールをクリックしたときに、次回訪問者がページにアクセスしたときに保存される値で、サッカーのページが開きます。

これまでのところ、私はhtml5 localstorageを使ってみましたが、うまく動作しません。

// Check browser support 
if (typeof(Storage) !== "undefined") { 
    // Store 

    localStorage.setItem("homepage", "index"); 
    // Retrieve 
    document.getElementById("result").innerHTML = localStorage.getItem("homepage"); 
} else { 
    //document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage..."; 
} 

function homepage_football(){ 
    localStorage.setItem("homepage", "football"); 
} 

HTML - ホームページあなたは、次のようなものを試してみてください

<a href="<?php echo site_url()."/sport/football/"?>" onclick="homepage_football()"> 
<a href="<?php echo site_url()."/sport/basketball/"?>" onclick="homepage_basketball()"> 
<a href="<?php echo site_url()."/sport/netball/"?>" onclick="homepage_netball()"> 

Answer 1

：どのようにユーザーをリダイレクトしている

setHomepage(page) { 
    localStorage.setItem('homepage', page) 
} 

redirectHomepage() { 
    let page = localStorage.getItem('homepage') 
    page && (window.location.href = page) 
} 

// on open of `football` page 
setHomepage('football') 

// on index load 
redirectHomepage() 

Answer 2

<script> 
function clickCounter() { 
    if(typeof(Storage) !== "undefined") { 
     if (localStorage.clickcount) { 
      localStorage.clickcount = Number(localStorage.clickcount)+1; 
     } else { 
      localStorage.clickcount = 1; 
     } 
     document.getElementById("result").innerHTML = "You have clicked the button " + localStorage.clickcount + " time(s)."; 
    } else { 
     document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage..."; 
    } 
} 
</script> 

<p><button onclick="clickCounter()" type="button">Click me!</button></p> 
<div id="result"></div>