兄弟复选框条件检查

Question

复选框上的这个 Meteor 模板事件 click .vote 会尝试检查它之前的直接同级以查看它是否被选中。如何做呢？谢谢

Template.checkbox.events({
  'click .valid': () => {
     //do stuff
  },
  'click .vote': () => {  //99c
    //check if its nearest sibiling is checked else exit
    if ($(this).prevAll('input.valid').checked) {  //<------ not cutting it
       console.log('its sibling is checked');
       //do stuff
    } else {
      console.log('its sibling is not checked');
      //do other stuff
    }
  }
});

<template name="checkbox">
  <div class="checkbox-container">
    <div class="checkbox">
      <label class="check">
        <input class="valid" type="checkbox" name={{name}} value={{value}} checked={{checked}}>{{label}}
        <input class="vote" type="checkbox" name={{name}} value={{value}} checked={{checked}}>
      </label>
    </div>
  </div>
</template>

Answer 1

试试这个：您可以像下面那样使用 .siblings()

$(function(){
$(".vote").click(function(){
if($(this).siblings('input.valid').is(":checked")) {  //<------ not cutting it
   console.log('its sibling is checked');
   //do stuff
} else {
  console.log('its sibling is not checked');
  //do other stuff
}
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

    <div class="checkbox">
        <input class="valid" type="checkbox">Checkbox Valid
        <input class="vote" type="checkbox">Checkbox Vote
    </div>

有关Siblings()

的更多信息

Answer 2

$(".vote").change(function() {

  if ($(this).closest('.check').find('input.valid').is(":checked")) { 
    console.log('its sibling is checked');
    //do stuff
  } else {
    console.log('its sibling is not checked');
    //do other stuff
  }
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="checkbox-container">
  <div class="checkbox">
    <label class="check">
        <input class="valid" type="checkbox" name={{name}} value={{value}} checked={{checked}}>{{label}}
        <input class="vote" type="checkbox" name={{name}} value={{value}} checked={{checked}}>
      </label>
  </div>
</div>

这就是您正在寻找的解决方案:checked

兄弟复选框条件检查

Sibling checkbox condition check

html

jquery

siblings

meteor