如何通过JavaScript动态选中/取消选中html复选框

时间:2013-10-29 18:37:29

标签: javascript checkbox

我知道有几个关于这个话题的问题已被提出,但我无法找到答案。

我已将checkbox视为

<input type="checkbox" name="text" checked="checked" />

我需要通过检查/取消选中来发送ajax请求,但我不知道if statement的可靠性(具有浏览器兼容性),例如

if (this.value == 'on')
{
this.value = 'off';
ajax call;
}
else
{
this.value ='on';
ajax call;
}

请注意,此处的值并不重要,我们需要捕获checked/unchecked,但是当html原始元素具有JavaScript时,如何通过checked="checked"控制已检查的元素?

如果使用checked代替value作为

if (this.checked == true)
{
this.checked = false;
ajax call;
}
else
{
this.checked =true;
ajax call;
}

checkbox的刻度线不会在浏览器中更改(始终勾选)。

2 个答案:

答案 0 :(得分:3)

以下内容应该有效:

function myFunction(elem)
{
    if (elem.checked)
    {
        alert("Im Checked");
    }
    else
    {
        alert("Im not checked");
    }
}

<强>标记

<input type="checkbox" name="text" checked="checked" onchange="myFunction(this);" />

http://jsfiddle.net/QMhn5/

<强>更新: 要更改其他元素的检查:

document.getElementById("chk").checked = true;

document.getElementById("chk").checked = false;

实施例: http://jsfiddle.net/QMhn5/1/

答案 1 :(得分:1)

如果你可以使用jquery,这应该有效:

<input type="checkbox" id="c1" />


$("#c1").change(function(){
    var checked = $(this).is(":checked");
    console.log(checked);
    //ajax call
})

小提琴:http://jsfiddle.net/XUgTC/,尝试点击复选框并查看控制台。