如何使用 javascript 检查复选框是选中还是未选中？

Question

I am trying to check weather a checkbox is checked or unchecked. This is my code:

<script type="text/javascript">
function EnableDisableToolTip() {
    if (document.forms[0].help_text.checked) {
        alert("Checked");
    }
    else if (!document.forms[0].help_text.checked) {
    alert("Unchecked");
    }        
}
</script>


<div id="tooltiponoff">
<form action="">
@Html.CheckBox("help_text", true, new { id = "help_text", onclick = "EnableDisableToolTip()" })Hjælpetekst
</form>
</div>

It only alerts Unchecked when i click it

Thanks in advance

Answer 1

try

< script type="text/javascript" >
function EnableDisableToolTip(Control) {
    if (Control.checked) {
        alert("Checked");
    }
    else {
    alert("Unchecked");
    }        
}
< /script >


< div id="tooltiponoff" >
< form action="" >
@Html.CheckBox("help_text", true, new { id = "help_text", onclick = "EnableDisableToolTip(this)" })Hjælpetekst
< /form >
< /div >

Answer 2

It seems to work for me - please see this fiddle . Note that the event listener is added by Javascript, instead of using the inline onclick syntax.

Answer 3

Make sure you are correctly referencing the object by using the console or alerting document.forms[0].help_text. It's very likely it's not the right reference.

alert(document.forms[0].help_text);

Answer 4

Your code is very well but not greatable. For example when many click the checkbox after 1 unclick then checkbox is start over. My English so bad i cannot explain But: You check many checkbox and then fall the if statement. And then unclick one, this is falling else statement. And checked ones falling down. Your code is developing like this:

            var count = 0;
            function Tik(Control) {
                if (Control.checked) {
                    count++;
                }
                else {
                    count--;
                }
                if (count > 0) {
                    document.getElementById("btnMessageDel").disabled = false;
                }
                else {
                    document.getElementById("btnMessageDel").disabled = true;
                }
            }

<input type="submit" id="btnMessageDel" name="btnMessageDel" class="btn btn-primary" value="Delete" form="messagesform" disabled />
<input type="checkbox" value="@MessageId" name="chkMessage" id="chkMessage" onclick="Tik(this)" />