javascript - Add change event on hidden checkbox -


i'm trying catch change event, or @ least click event on checkbox. i've read when "visibility : hidden" or "display:none", event not fired. add eventlistener label seems not working too. can't understand how make work.

document.addeventlistener("domcontentloaded", function() {    var gamecount = document.getelementsbyclassname("innercount")[0];    var checklabel = document.queryselector("input[type=checkbox] + label");    checklabel.addeventlistener("onclick", function() {      if (checklabel.checked) {        gamecount.innerhtml = "--";        console.log("turnon");      } else {        gamecount.innerhtml = "";        console.log("turnoff");      }    })  });
.checkbox > input[type=checkbox] {    visibility: hidden;  }  .checkbox {    display: inline-block;    position: relative;    width: 60px;    height: 30px;    border: 2px solid #424242;  }  .checkbox > label {    position: absolute;    width: 30px;    height: 26px;    background-color: #a50005;    cursor: pointer;  }  .checkbox > input[type=checkbox]:checked + label {    right: 28px;  }
<div id="switcher">    <span class="labels">on</span>    <div class="checkbox">      <input id="checkme" type="checkbox">      <label for="checkme"></label>    </div>    <span class="labels">off</span>  </div>

use change event listener checkbox fields.

document.addeventlistener("domcontentloaded", function() {   var gamecount = document.getelementsbyclassname("innercount")[0];   var checklabel = document.queryselector("input[type=checkbox]");   checklabel.addeventlistener("change", function() {     if (checklabel.checked) {       gamecount.innerhtml = "--";       console.log("turnon");     } else {       gamecount.innerhtml = "";       console.log("turnoff");     }   }) }); 

Comments

Popular posts from this blog

python - How to insert QWidgets in the middle of a Layout? -

python - serve multiple gunicorn django instances under nginx ubuntu -

module - Prestashop displayPaymentReturn hook url -