Cookie com jQuery

flaviomuniz — Thu, 18 Mar 2010 14:28:41 +0000

Olá, hoje vou mostrar como é simples trabalhar com cookie usando a jQuery.

Primeiro, vamos baixar o framework ja na nova versão 1.4 e o jquery.cookie.

Pronto, ja tendo os plugins, vamos por a mão na massa.
Abaixo no código, as linhas do js estão comentadas de acordo com a sua ação,
não tem segredo, não é copiar e colar, prestar atenção nos comentários e alem de tudo, entender.

            
            <script type="text/javascript">

                $(document).ready(function(){

                    //Usamos a função find para buscar o "a" dentro da div "link" na ação do click

                    $("#link").find("a").click(function(){

                        //Declaramos que idBg vai ter o mesmo valor do ID do link clicado

                        var idBg = $(this).attr("id");

                        //Setamos o cookie com o nome de bg_fundo e passamos o valor do idBg, expirando em 7 dias.

                        $.cookie("bg_fundo", "" + idBg + "", { expires: 7 });

                        //Adicionamos uma classe ao body ou alguma div que você queira, passando o nome

                        //do cookie que no nosso caso é o bg_fundo.

                        $("body").addClass($.cookie("bg_fundo"));

                    });

                    //Ao abrir a página ou recarregar, ele traz o cookie adicionando a classe bg_fundo.

                    $("body").addClass($.cookie("bg_fundo"));

                });

            script>

Background preto

Background verde

Background vermelho

Veja o exemplo

Qualquer coisa, postem que eu tiro dúvidas.

Até a próxima.

FlavioMuniz » Blog » Css

Cookie com jQuery

15 plugins da jquery que não podem faltar no seu projeto.