Question

我有一个事件函数'click .category'，只要点击<li class="category">就会调用它。它是下拉列表中的一个元素，特别是来自Bootstrap的元素。我真的不知道如何通过将'disabled'类添加到<li>来禁用该元素。我知道在jQuery中你只需执行一个像.addClass这样的简单函数。 Meteor / Blaze有没有办法实现这个目标？

Answer 1

您是否尝试过类似下面的内容？

Template.myTemplateName.events({
  "click .category": function(event, template){
    event.preventDefault();
    $('.category').addClass('disabled');
  }
});

Answer 2

以下是使用ReactiveVar实现此目标的标准Meteor方式。

HTML

<template name="category">
  <li class="category {{disabled}}">
    {{! category HTML}}
  </li>
</template>

JS

Template.category.onCreated(function(){
  this.disabled = new ReactiveVar(false);
});

Template.category.helpers({
  disabled: function(){
    var disabled = Template.instance().disabled.get();
    return disabled ? "disabled" : "";
  }
});


Template.category.events({
  "click .category": function(event, template){
    var disabled = template.disabled.get();
    template.disabled.set(!disabled);
  }
});

让Meteor模板渲染引擎（Blaze）为您操作DOM总是更好。使用模板实例可以轻松编写可重用的组件。

单击时禁用<li>元素

2 个答案: