CODEWITHSUNDEEP
javascripthtml
arodebaugh
arodebaugh

Reputation: 538

See if check box is clicked until it is clicked

I am seeing how I can make an Are You Human checkbox, but I am having a problem (Code At The End). I am trying to make it see if it is clicked until it is clicked. I tried onclick, but that is not working.

window.onload = function() {
  var input = document.getElementById('ruhuman');

  function check() {
    if (input.checked) {
      ruhuman.checked = true;
      if (event.originalEvent === undefined) {
        ruhuman.human = false;
      } else {
        ruhuman.human = true;
      }
    }
    alert(ruhuman.human);
    alert(ruhuman.checked);
  }
  input.onchange = check;
  check();

}
<input type="checkbox" id="ruhuman" class="ruhuman" onclick="check()" required="required">
<label>R U Human?</label>

Edit: Thanks for your help! Finished product at http://ruhuman.github.io/.

To the people that answered I can put your github for your help!

Upvotes: 1

Views: 81

Answers (2)

devlin carnate
devlin carnate

Reputation: 8591

originalEvent is JQuery, not JavaScript. A workaround is to test screenX and screenY -- if it's a human, these will have some value based on the checkbox position. Also, you can remove the onclick from your html and tie your click event like this:

document.getElementById ("ruhuman").addEventListener("click", function(e){
    if (this.checked) {
      ruhuman.checked = true;
      if (e.screenX && e.screenY) {
        ruhuman.human = true;
      } else {
        ruhuman.human = false;
      }
    }
    console.log(ruhuman.human);
    console.log(ruhuman.checked);
  });

JS Fiddle Demo

Upvotes: 2

Swiffy
Swiffy

Reputation: 4693

This works: https://jsfiddle.net/rz4pmp5L/3/

var input = document.getElementById('ruhuman');
var ruhuman = 
{
  checked: false
};

function check() 
{
  if (input.checked) 
  {
    ruhuman.checked = true;
  }
  alert(ruhuman.checked);
}

input.onchange = check;
check();

The problem was (at least) that ruhuman was not defined at all.

Upvotes: 1

Related Questions