Question

<template name="menu">

<div class="ui grid">
    <div class="two wide column"></div>
    <div class="twelve wide column">
        <div class="ui red menu">
            <a class="{{active}} item" id="home">
                <i class="home icon"></i> Péng you
            </a>
            <a class="item" id="message">
                <i class="mail icon"></i> Message
            </a>
            <a class="item" id="friend">
                <i class="user icon"></i> Find Friend
            </a>

            <div class="right red menu">
                <a class="active item">
                    <i class="sign in icon"></i> Log In
                </a>
            </div>
        </div>
    </div>
    <div class="two wide column"></div>
</div>

Template.menu.helpers({
'active': function (e, tmpt) {
    var active = Session.get('activeMake');
    return active
}
});
Template.menu.events({
'click #home': function (e, tmpt) {
    event.preventDefault();
    var activeAttribute = "active";
    Session.set('activeMake', activeAttribute);
}
});

现在，我可以积极参与。但是，当用户搞砸其他菜单时，我无法删除活动。

我认为有更好的方法可以做到这一点。（例如：没有会话或ID属性）

请帮帮我....

Answer 1

这是一个古老的问题，我遇到同样的麻烦，但这不是完美的方式。在我的情况下，我有5个元素，所以它工作得很快，但在其他应用程序，我有300个按钮，并在cordova应用程序，特别是老人平板电脑工作慢慢。

Template.yourtTemplateName.events({
    'click .commonClass': function (e, t) {
        $(".commonClass").each(function () {
            console.log(this);
            $(this).removeClass('active')
        });
        $(e.target).addClass('active')
    },
});

我想用Meteor +语义UI给出'class = active'属性

1 个答案: