最好的方法来改变HTML状态类活动页面

Question

在我测试2个例projets，一个只表示，另一个tower.js

我只想把正确的CSS类在活动的李页面，在页面渲染的开始。

例：

我在页/信息，我要添加类活跃在第一李

信息

其他

模板引擎我我使用的是Coffekup/Jade

我试图得到url路径并与href比较，通过本地传递......但我不认为是一个好的解决方案通过当地人..

任何更好的解决方案？

谢谢。

Answer 1

此答案适用于towerjs和coffeekup。我没有足够的经验与快递和玉来说出任何关于它的事情。

在coffeekup中，将诸如css类的属性放在html标签上的正确方法是使用散列，即attributeName: atrributeValue。一个例子，从处理主布局tower.js模板，这是app/views/layouts/application.coffee将是：

nav id: "navigation", class: "navbar", role: "navigation", -> 
     div class: "navbar-inner", -> 
     div class: "container", -> 
      partial "shared/navigation" 

看，这里我们有标签三层，与嵌套在一个div一个导航，和另一div嵌套在其中，然后是内部呈现的部分内容。而不是部分，它可以很容易地是文本。

所以，你的情况，你会进入app/views/info，并找到你想要把类的李正确的模板，那么这将仅仅是

li class: "active", -> 

现在，如果你谈论关于如何改变li上的css类，一旦它已经被渲染，动态地，你需要从客户端代码做到这一点，你会使用coffeescript，就像你会在一个普通的html页面中使用javascript一样。

如果你想学习塔和coffeekup（现在实际上是咖啡杯），我真的推荐https://github.com/mark-hahn/coffeekup-intro。你可以在不到半个小时的时间内完成任务，并且对咖啡杯有很好的理解。如果您想查看带解释的Towerjs应用程序的示例，可以在此处查看我的demoApp：https://github.com/edubkendo/demoApp。

编辑：现在，我明白它回答这样的问题：

首先，在config/assets.coffee，在第一块，加"/app/client/controllers/applicationController"像这样：

module.exports = 
    javascripts: 
    application: [ 
     "/app/client/config/application" 
     "/config/routes" 
     "/app/views/templates" 
     "/app/models/user" 
     "/app/client/controllers/usersController" 
     "/app/models/post" 
     "/app/client/controllers/postsController" 
     "/app/client/controllers/applicationController" 
] 

然后，在您的客户端控制器，app/client/controllers/applicationController.coffee：

class App.ApplicationController extends Tower.Controller 

    pathname = window.location.pathname 

    pathRegExp = new RegExp(pathname.replace(/\/$/,'') + "$") 

    $('.navbar a').each(-> 
    if (pathRegExp.test @href.replace(/\/$/,'')) 
     $(@).addClass('active') 
    ) 

这将现在将活动类添加到当前活动的链接。