Javascript Onclick Cookies Kullanımı

0

Arkadaşlar kolay gelsin. Javascript ile aram hiç iyi değil. Günlerdir araştırmama rağmen henüz bir sonuç alabilmiş değilim. Bilenlerinizin yardımcı olmasını rica ediyorum.

Sitemde sütunları gizlemek için aşağıdaki gibi bir kod yaptım:

<a href="#"onClick="$('.sol_kisim').toggle({}); return true;">Sol Kolonu Gizle</a> 

<a href="#"onclick="$('.sag_kisim').toggle({}); return true;">Sağ Kolonu Gizle</a>

Burada gördüğünüz üzere onclick kullandım. Bunu Cookie şeklinde tarayıcıya önbelleklemek istiyorum. Yani kullanıcı bir kolonu gizlediğinde ve sayfa değiştirdiğinde yaptığı değişiklik kaybolmasın. Sol kolonu gizle dediyse, göster diyene kadar gizli kalsın.

Bunun için aşağıdaki dosyayı siteme ekledim çağırdım:

<script type="text/javascript" src="sitem/js/jquery.cookie.js"></script>

Ondan sonra da:

<script type="text/javascript">
   $.cookie("onbellek"); 
   $.cookie("onbellek", ".sol_kisim") 
   $.cookie("onbellek", ".sol_kisim", {expires: 7}); 
</script>

Bu tarz bir kullanım yaptım. Ancak yine olmadı. Yardımcı olabilirseniz gerçekten çok memnun olurum.

buyurindir buyurindir (1)
8 yıl önce sordu

    Toplam 1 Cevap


    0

    Cookie yerine HTML5 ile gelen localStorage kullanabilirsin. Sana örnek bir kod yazdım.

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    <style>
        #sag{ width:500px; height:300px; background-color:#ff0000; display:inline-block}
         #sol{ width:500px; height:300px; background-color:#ffd800;display:inline-block}
    </style>
    
    <div id="sol">SOL</div>
    <div id="sag">SAĞ</div>
    <p>
        <a href="#" id="btnsol">solu gizle</a>
        <a href="#" id="btnsag">sagi gizle</a>|
        <a href="#" id="btnsolgoster">solu goster</a>
        <a href="#" id="btnsaggoster">sagi goster</a>
    
    </p>
    <script>
        $(function () {
            if (localStorage.sol) {
                $('#sol').toggle();
            }
            if (localStorage.sag) {
                $('#sag').toggle();
            }
            $('#btnsol').click(function (e) {
                e.preventDefault();
                $('#sol').toggle();
                localStorage.setItem("sol", "gizli");
            })
            $('#btnsag').click(function (e) {
                e.preventDefault();
                $('#sag').toggle();
                localStorage.setItem("sag", "gizli");
            })
            $('#btnsolgoster').click(function (e) {
                e.preventDefault();
                $('#sol').toggle();
                localStorage.removeItem("sol");
            })
            $('#btnsaggoster').click(function (e) {
                e.preventDefault();
                $('#sag').toggle();
                localStorage.removeItem("sag");
            })
        })
    </script>

    Detaylı bilgiyi burada bulabilirsin: HTML5 Web Storage nedir? nasıl kullanılır?

    Basitçe kullanıcı bilgisayarında bir bilgi saklamak istiyorsak localStorage ile şu şekilde yapıyoruz:

    localStorage.setItem("Ad", "Deger");

    localStorage ile sakladığımız veriyi okumak için

    localStorage.Ad;

    demek yeterli oluyor. localStorage ile saklanan veriyi silmek için

    localStorage.removeItem("Ad");

    gibi kullanabilirsin.

    localStorage ile bilgiler kullanıcı tarayıcısında saklanıyor. localStorage, cookie'ye göre daha güvenli ve daha fazla veriyi saklayabilir. 

    Ayrıca localStorage tüm modern tarayıcılar tarafından desteklenir.

     

    alattin alattin (16999)
    8 yıl önce cevaplandı

      üyelik gerektirir

      Cevap yazabilmek için üye girişi yapmalısınız.

      Eğer uzmanim.net üyesiyseniz giriş yapabilirsiniz: üye girişi yap
      uzmanim.net'e üye olmak çok kolaydır: hemen kayıt ol