meteor从checkbox switchChange中检索true/false值

Question

我有一个附加到复选框的事件处理程序.我正在使用自举开关http://www.bootstrap-switch.org/

我试图将状态值(true或false)输入变量,因此我可以将其设置为会话值.

当状态改变时,我可以得到真值或假值(如渲染代码中所示).但是,我想在事件中获得这个价值.请检查我的x变量.

client.js

Template.myTemplate.rendered = function () {
 $('input[name="questions"]').bootstrapSwitch('state', true, true);
 $('input[name="questions"]').on('switchChange.bootstrapSwitch', function(event, state) {
 console.log(state); // true | false
});

HTML:

<template name="myTemplate">
 <div class="row">
  <input type="checkbox"  name="questions" unchecked> Hobby?
 </div>
 <div class="row">
  <input type="checkbox" name="questions" unchecked> Writer?
 </div>

我试图将console.log(state)在渲染的代码中打印出来的值放入我的事件中的变量中,这样我就可以将会话值设置为true或false.

Template.myTemplate.events({
'click input': function(event) {
  var x = $(this).is(":checked").val();
  Session.set("statevalue", x);
  console.log(Session.get("statevalue")); // this is not printing out anything
 }
});

Answer 1

我想我有更好的解决方案而不是直接使用JQuery:

Template.myTemplate.events({
'change input': function(event) {
  var x = event.target.checked;
  Session.set("statevalue", x);
  console.log(Session.get("statevalue"));
 }
});

请注意,我建议您使用更改而不是单击事件.

Answer 2

您应该使用模板实例：

Template.myTemplate.events({
'click input': function(event, template) {
  var x = template.$('input').is(":checked").val();
  Session.set("statevalue", x);
  console.log(Session.get("statevalue"));
 }
});

或者也许与“目标”：

Template.myTemplate.events({
'click input': function(event) {
  var x = $(event.target).is(":checked").val();
  Session.set("statevalue", x);
  console.log(Session.get("statevalue"));
 }
});