Question

我正在使用mootools来做到这一点：我有一个看起来像这样的ul

<ul>
    <li><a class="option">TEXT</a></li>
    <li><a class="option">TEXT</a></li
    <li><a class="option">TEXT</a></li>
    <li><a class="option">TEXT</a></li>
</ul>

我想让一个li从'option'点击到'option-selected'时更改，我的当前代码如下所示

$$('li.option').addEvent('click', function(el){
    this.toggleClass('option-selected');
});

这确实有效，但我的问题是如何点击事件让其他li类'恢复为类选项并将当前点击的li类设置为选项选择？

Answer 1

(function () {
    var list = document.id('menu'),
        os = 'option-selected';

    menu.addEvent('click:relay(li .option)', function (e, el) {
        e.preventDefault();
        menu.getElements('.' + os).removeClass(os);
        el.addClass(os);
    });
}());

可以玩它/在这里调整它。 http://jsfiddle.net/dimitar/nYEkj/

它锚定到ul元素，只通过事件委托附加1个事件。取决于你的策略是什么 - 将类添加到li或者添加到As

如何使用mootools onclick更改ul中的类

1 个答案: