如何在复选框被选中的基础上显示div

Question

I am developing a game in that at the rules n regulation page i have a check box so i want when check box is checked continue button should appear otherwise it should be disappear from the page.

<div id = "bSubmit"><input type="submit" value="continue"></div> 

function validate() {
    if (document.getElementById('iAgree').checked) 
    {
        bSubmit.display='block';
    } 
    else
    {
        bSubmit.display='none';
    }
}

Please help me out

Answer 1

Well there are points you need to change or add in your code. The one that I came up with is as follows.

You can further improve it by separating the js into another file and wrapping your code in a document.onload function.

<input type="checkbox" id="iAgree"/>
<div id = "bSubmit"><input type="submit" value="continue"></div> 

<script>

    var bIAgree = document.getElementById('iAgree');

    function validate() {

        var bSubmit = document.getElementById('bSubmit');

        if (bIAgree.checked) {
            bSubmit.style.display='block';
        } else {
            bSubmit.style.display='none';
        }
    }
    // For the first time that the page loads,
    // set the state of the div
    validate(); 

    // set the state of the div when the checkbox state has changed
    bIAgree.onchange = validate;

</script>