取消选中包含条件的复选框



我想在一个网站上做一个调查,有一个问题和三个可能的答案。

问题是我在检查/取消选中时遇到问题,我只想检查一个答案,因此如果用户单击一个答案并且他已经检查了另一个答案,则它只会保留最后一个答案。

这是我所做的:

$("input:checkbox").click(function() {
    if($(this).is(':checked')){
        var iSurveyId = $(this).closest('div').attr('name');
        var iAnswerId = $(this).closest('p').attr('value');
        var bIsChecked = 'true';

如果用户单击复选框,我将获得以我的div 名称命名的调查 ID 和以我的段落名称命名的答案 ID。

我正在使用jQuery 1.1.12,所以我不能使用每个函数来举例,我不能使用.prop()。

您可以使用输入类型单选按钮而不是复选框,以便所有用户只能选择一个答案,或者像这样先清除所有复选框

$("input:checkbox").click(function() {
     $('input:checkbox').removeAttr('checked');
     $(this).attr('checked', 'checked');
}

上面应该从所有选择框中删除选中的属性,并将选中的属性分配给单击的属性,或者如果您有多个问题,每个问题有多个答案,您可以将复选框放在div 中并将代码更改为:

$("input:checkbox").click(function() {
    $('#div_id input:checkbox').removeAttr('checked');
    $(this).attr('checked', 'checked');
}

使用这个简单的代码

$("input:checkbox").click(function() {
    var thisChecked = $(this)[0].checked;
    $("input:checkbox").removeAttr('checked');
    
    if (thisChecked)
        $(this).attr("checked", true);
    else 
        $(this).attr("checked", false);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<div>
    <input type="checkbox" />
    <span>Item 1</span>
</div>
<div>
    <input type="checkbox" />
    <span>Item 2</span>
</div>
<div>
    <input type="checkbox" />
    <span>Item 3</span>
</div>
<div>
    <input type="checkbox" />
    <span>Item 4</span>
</div>

最新更新