Checkbox changing value?

I have a checkbox which I use with an onchange function like this:

<input name="topbar_active" type="checkbox" value="1" onchange="topbaractivate(this.value);"/>

And then I have this script:

function topbaractivate(c){
        alert(c);
    if (c == 1){
        // Do something here //
    } else {
        // Do something else here //
    }
}

But the trouble is that nomatter if the checkbox is checked or not it passes the value β€œ1”.

How do I get passed this?

Thanks in advance :slight_smile:

The proper way to tell if a checkbox has been checked by a user is to use the checked property, see the following jsFiddle for a simple demo of how to accomplish this.

Tryid this but it doesnt react the first time I hit the checkbox… After that it works? What am I doing wrong?

function topbaractivate(){
    document.getElementById('topbar_active').onchange = function() {
        if(this.checked == true){
            jQuery("#mif").contents().find("#startheader h1").css("display","inherit");
            jQuery("#mif").contents().find("#startheader #logo").css("display","none");
        } else {
            jQuery("#mif").contents().find("#startheader h1").css("display","none");
            jQuery("#mif").contents().find("#startheader #logo").css("display","inherit");
        }
    };
}

If your using jQuery then you can simplify the entire process by using the following instead:

<input name="topbar_active" type="checkbox" value="1" />
$('input[name=topbar_active]').change(function() {
    if ($(this).is(':checked')) {
        var display = ['inhert', 'none'];
    } else {
        var display = ['none', 'inhert'];
    }

    $('#mif')
        .contents()
        .find('#startheader h1')
        .css('display', display[0])
        .find('#startheader #logo')
        .css('display', display[1]);
});