0

I am trying to achieve a checkbox option to detect the state of the checkbox - If the checkbox is checked, then run the function, if someone checks off, it should shut off the function.

Currently, the function works only if its not checked, and when a user checks the box, the function starts up, but you cant disable it.

var nbDrop = 150; 

// function to generate a random number range.
function randRange( minNum, maxNum) {
  return (Math.floor(Math.random() * (maxNum - minNum + 1)) + minNum);
}

// function to generate drops
function createRain() {

    for( i=1;i<nbDrop;i++) {
    var dropLeft = randRange(0,1260);
    var dropTop = randRange(-1000,1400);

    $('.rain').append('<div class="drop" id="drop'+i+'"></div>');
    $('#drop'+i).css('left',dropLeft);
    $('#drop'+i).css('top',dropTop);
    }

}

Jquery checked function

$('input[name="purerain"]').on('click', function(){
    if(!$(this).is(':checked')) {

    } else {
        createRain();
    }
});
jagmitg
  • 4,236
  • 7
  • 25
  • 59
  • What do you mean by "but you cant disable it"? Don't you use `if ... else` statements in your code? Do you want to remove the generated elements when checkbox is unchecked? – Ram Aug 24 '14 at 13:03

1 Answers1

0

Here's the code that works for you.

$('input[name="purerain"]').change(function(){
   if($(this).is(':checked')) {
       createRain();
   }
});
Viswanath Donthi
  • 1,791
  • 1
  • 11
  • 12