取消选中Meteor模板事件中的所有其他单选按钮

时间:2017-02-06 12:37:39

标签: javascript jquery

此Meteor模板允许用户单击单选按钮但无法取消选中其他单选按钮。有没有一种有效的方法在javascript或jQuery中与当前的click .twin-item'事件一起使用?

<template name="results">
  <div class="twin-group js-radioGroup" data-id={{_id}}>
    <ul class="upShift">
      {{#each display.deciders}}
        <li>
          <label class="twin-item">
            <input type="radio" value={{this.result}}>
            <span class="radio-label">{{this.label}}</span>
          </label>
        </li>
      {{/each}}
    </ul>
  </div>
</template>
Template.results.events({
  'click .twin-item': (event) => {
    let val = event.target.value;
    if (val) {
      Meteor.call('myMethod', val);
    }
  }
});

1 个答案:

答案 0 :(得分:0)

你不需要javascript。如果为所有单选按钮指定相同的name属性,则默认情况下只会选中一个单选按钮

将您的代码更改为

<template name="results">
  <div class="twin-group js-radioGroup" data-id={{_id}}>
    <ul class="upShift">
      {{#each display.deciders}}
        <li>
          <label class="twin-item">
            <input type="radio" name="rbtn" value={{this.result}}>
            <span class="radio-label">{{this.label}}</span>
          </label>
        </li>
      {{/each}}
    </ul>
  </div>
</template>