CODEWITHSUNDEEP
javascripthtml
Bundyboy
Bundyboy

Reputation: 161

How to call javascript function only when checkbox is checked

i have tried this:

    function stickyheaddsadaer() {
        $("#page-header-inner").addClass("sticky");
    }

    <input type="checkbox" name="TT_sticky_header" id="TT_sticky_header_function" 
value="{TT_sticky_header}" onclick="stickyheaddsadaer()"/>

so when i click checkbox, it just nothing happens....

but when i try this:

function stickyheaddsadaer() {
    alert("I am an alert box!");
}

then works...

can you please help me ? I need to activate javasript function by checkbox

and when the js function is actived it add class to the div

Thank you

Upvotes: 11

Views: 54163

Answers (3)

rootleet
rootleet

Reputation: 391

HTML

<input type="checkbox" id="switch" onclick="change()">

JS

function change() {
    var decider = document.getElementById('switch');
    if(decider.checked){
        alert('check');
    } else {
      alert('unchecked');
    }
}

Upvotes: 5

Ajit Kumar
Ajit Kumar

Reputation: 111

function checkFluency(){
    var checkbox = document.getElementById('fluency');
    if (checkbox.checked != false) {
	    alert("Checkbox checked")
    }else{
	    alert("Not Checked")
    }
}
<input type="checkbox" onclick="checkFluency()"  id="fluency" />

Upvotes: 1

AHJeebon
AHJeebon

Reputation: 1248

Better to use onchange event and check inside function if checked or not

function stickyheaddsadaer(obj) {
  if($(obj).is(":checked")){
    alert("Yes checked"); //when checked
    $("#page-header-inner").addClass("sticky");
  }else{
    alert("Not checked"); //when not checked
  }
  
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="TT_sticky_header" id="TT_sticky_header_function" value="{TT_sticky_header}" onchange="stickyheaddsadaer(this)"/>

Upvotes: 20

Related Questions