【问题标题】:How to dynamically check/uncheck html checkbox by JavaScript如何通过 JavaScript 动态检查/取消选中 html 复选框
【发布时间】:2013-10-30 03:02:50
【问题描述】:

我知道有人问过有关此主题的几个问题,但我无法为我的案例找到答案。

我有一个选中的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原始元素有checked="checked"时,如何通过JavaScript控制被选中的元素呢?

如果使用checked 而不是value 作为

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

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

【问题讨论】:

    标签: javascript checkbox


    【解决方案1】:

    以下应该有效:

    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/

    【讨论】:

    • 如何勾选/取消勾选?
    【解决方案2】:

    如果你可以使用 jquery,这应该可以工作:

    <input type="checkbox" id="c1" />
    
    
    $("#c1").change(function(){
        var checked = $(this).is(":checked");
        console.log(checked);
        //ajax call
    })
    

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

    【讨论】:

    • 我不认为 OP 想要 jQuery。
    • :) 不用道歉,我一直都这样做。
    • @HanletEscaño 是的,我喜欢纯 JS。
    猜你喜欢
    • 1970-01-01
    • 2013-08-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-24
    • 2016-12-23
    • 2018-09-15
    相关资源
    最近更新 更多