2010-09-09 50 views
0

嘿伙计。我正在设置一个页面,如果你点击一个链接,这个类将会改变。更进一步,这将不得不存储在一个cookie中。每个A标签都有一个唯一的ID。jQuery - 点击更改类并通过cookie记住

例如,下面是我的榜样链接:

<a href="#" id="unique1" class="up">Link text</a> 

当用户点击该链接,然后将需要的类是“向下”改变一个cookie将不得不被保存一周,记忆这个点击。以后任何对该页面的访问都必须引用cookie,并且如果之前点击了该链接,则相应地设置该类。

我对JavaScript和jQuery的知识很少..这只是我的头脑之上。有关如何进行这项工作的任何建议?

回答

0

确定您可以将该类更改为关闭点击。

$(".up").click(function(evt){ $(event.target).removeClass("up").addClass("down"); }); 

Cookie处理JS? Read up a bit就此。您基本上想要将唯一ID设置为cookie中的数组/列表。然后在页面加载执行此操作。

// list = ['#unique1', '#unique2' ... '#unique-n']; 
for(var id in list) 
{ 
    $(id).removeClass("up").addClass("down"); 
} 
+0

让我们的班级在点击上发生变化是我最后的一个可行的部分。我真的不放弃如何在cookie中设置数组并将其与上面的jquery进行比较。 – 2010-09-09 16:20:34

+0

@Robert:我指出你的链接非常好。你几乎可以逐字使用这个脚本来做到这一点。 – 2010-09-09 16:28:33

1

我会用这个插件来实现这一点:

http://code.google.com/p/cookies/

的代码可能是这样的:

// set default options 
    // expires date 
    var $todayDate = new Date(); 
    var $expireDate = ($todayDate.getDate() + 7) + '/' + $todayDate.getMonth() + '/' + $todayDate.getFullYear(); 

     $.cookies.setOptions({ 
      expiresAt: $expireDate; 
      }); 


    // click functionality 
     $('#unique1').click(function(){ 

      var $this = $(this); 

      $this.removeClass('up').addClass('down'); 

      var $thisClass = $this.attr("class"); 

      $.cookies.set('ckClass', $thisClass); 

      return false; 

     }); 

检查Cookie值,并确保类是目前使用类似于:

var $ckVal = $.cookies.get('ckClass'); 
    if ($ckVal) { 
     if ($ckVal == 'up') { 
      $('#unique1').attr('class', '').addClass('up'); 
     } else { 
      $('#unique1').attr('class', '').addClass('down');} 
    } 
+0

如果您希望在每次点击时更新到期日期,那么该日期的代码将不得不移到点击方法中,并且将有效日期添加到其中一个选项中。 – RyanP13 2010-09-09 16:55:10

+0

行上似乎有语法错误:expiresAt:$ expireDate; 虽然...... Firebug不停地对我发出警告,但我无法完全明白会发生什么情况。 – 2010-09-09 19:55:19

+0

在此代码之前是否已下载并链接到cookie插件? – RyanP13 2010-09-09 22:24:36