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

如果您為復選框定義了id，則可以使用

event.target.checkboxID.checked 

在模板事件中。

如果選中或不選，則返回true或false。

Answer 3

你應該使用模板實例：

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"));
 }
});

Answer 4

Template.myTemplate.rendered = function () {
 $('input[name="questions"]').bootstrapSwitch('state', true, true);
 $('input[name="questions"]').on('switchChange.bootstrapSwitch', function(event, state) {
 var x = $(event.target).is(":checked");
 Session.set("statevalue", x);
  console.log(Session.get("statevalue"));
}); 
}

Answer 5

'click .task_checkbox'(event){

    const target = event.target;
    var isChecked = $("#"+event.target.id).is(":checked").val();
    console.log(isChecked);

},

Answer 6

event對象已具有所需的所有信息。

Template.myTemplate.events({
  'click input': function(event) {
    if (event.target.name === 'questions') {
      Session.set("statevalue", event.target.checked);
      console.log(Session.get("statevalue"));
    }
  }
});