Question

复选框上的此Meteor模板事件click .vote会尝试检查它之前的直接兄弟，以查看它是否已被选中。怎么做到呢？ THX

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

＆＃13;

$(".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();

＆＃13;

<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>

＆＃13;

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

同级复选框条件检查

2 个答案: