jQuery Cookieを使用してページのロード/リフレッシュ時にトグル状態を保持する

Question

私が取り組んでいるサイトにアクセシビリティ機能を実装しようとしています。 3つのトグルボタン（フォントサイズ、ハイライトされたリンクと色の反転）があり、jQuery Cookiesを使用してページのロード/リフレッシュ時にトグル状態を保持したい。私はそのテーマについて他のスレッドを読んだことがありますが、私は自分のシナリオがうまくいくにはあまりにも経験が足りません。事前に

$(document).ready(function(){ 
    $("button.type-size").click(function(){ 
     $("body").toggleClass("accessibility-font"); 
     $("button.type-size").toggleClass("on"); 
    }); 
    $("button.links").click(function(){ 
     $("a").toggleClass("accessibility"); 
     $("button.links").toggleClass("on"); 
    });  
    $("button.contrast").click(function(){ 
     $("body, img, .site-branding, .accessibility-bar, .no-invert, a, button").toggleClass("invert"); 
     $("button.contrast").toggleClass("on"); 
    }); 
}); 

ありがとう！

Answer 1

解決策が見つかりました。これは、ボタンが押されたかどうかを確認する方法です。

$(document).ready(function(){ 
    var sel = $.cookie("accessibility"); // get the cookie 
    console.log("from cookie:"+sel,sel!=true); 
    sel = sel=="true"; 
    $("body, a").toggleClass("accessibility",sel); // initial 
    console.log("after test:"+sel,$("body, a").hasClass("accessibility")); 

$("button.links").on("click",function() { 
    $("body, a").toggleClass("accessibility"); 
    var $this = $(this); 
    sel = !sel; 
    $.cookie("accessibility", sel,{ expires: 1, path: '/' }); 
}); 
});