Question

我在html中有以下代码

 <div class="ft_ck_area" id="fromFirstHalf">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="fromFirstHalfChk" name="fromChkValue" value="1"/>
                            <label for="fromFirstHalfChk" name="checkbox1_lbl" class="css-label">First Half</label>
                        </div>

                    </div>
                    <div class="ft_ck_area"  id="fromSecondHalf">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="fromSecondHalfChk" name="fromChkValue" value="2"/>
                            <label for="fromSecondHalfChk" name="checkbox1_lbl" class="css-label">Second Half</label>
                        </div>
                    </div>
                    <div class="ft_ck_area" id="fromFullDay">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="fromFullDayChk" name="fromChkValue" value="0"/>
                            <label for="fromFullDayChk" name="checkbox1_lbl" class="css-label">Full Day</label>
                        </div>
                    </div>



<div class="ft_ck_area" id="toFirstHalf">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="toFirstHalfChk" name="toChkValue"  value="1"/>
                            <label for="toFirstHalfChk" name="checkbox1_lbl" class="css-label">First Half</label>
                        </div>
                    </div>
                    <div class="ft_ck_area" id="toSecondHalf">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="toSecondHalfChk"  name="toChkValue" value="2"/>
                            <label for="toSecondHalfChk" name="checkbox1_lbl" class="css-label">Second Half</label>
                        </div>
                    </div>
                    <div class="ft_ck_area" id="toFullDay">
                        <div class="cb">
                            <input type="radio" class="css-checkbox" id="toFullDayChk" name="toChkValue" value="0"/>
                            <label for="toFullDayChk" name="checkbox1_lbl" class="css-label">Full Day</label>
                        </div>
                    </div>

在javascript中我正在执行以下代码后，从复选框中删除了checked属性，如果我在html中看到它但是它没有显示为已选中，则会附加在html中，

       if (dateDiff == 0) {
                var fromCheckedId=$('input[name=fromChkValue]:checked').attr("id");
                $("#"+fromCheckedId).removeAttr("checked");
                console.log("1");
                console.log("#"+fromCheckedId);
                var toCheckedId=$('input[name=toChkValue]:checked').attr("id");
                $("#"+toCheckedId).removeAttr("checked");
                console.log("2");
                console.log("#"+toCheckedId);
                $("#fromFullDayChk").attr("checked","checked");
                }
                else
                {
                    var fromCheckedId=$('input[name=fromChkValue]:checked').attr("id");
                $("#"+fromCheckedId).removeAttr("checked");
                console.log("3");
                console.log("#"+fromCheckedId);
                var toCheckedId=$('input[name=toChkValue]:checked').attr("id");
                $("#"+toCheckedId).removeAttr("checked");
                console.log("4");
                console.log("#"+toCheckedId);
                $("#fromFullDayChk").attr("checked","checked");
                $("#toFullDayChk").attr("checked","checked");
                }

这段代码有什么问题？在删除属性后，againe我有附加属性

Answer 1

使用此

  $("#fromFullDayChk").attr("checked",true);

而不是

$("#fromFullDayChk").attr("checked","checked");

如果您使用的是最新版本的Jquery，请使用prop，如下所示：

$("#fromFullDayChk").prop("checked",true);

Answer 2

使用.prop()代替使用.attr()（因为您使用的是Jquery 1.11.1）：

在特定情况下，属性和属性之间的差异非常重要。在jQuery 1.6之前，.attr（）方法有时会获取属性检索某些属性时会考虑这些值，这可能会导致不一致的行为。从jQuery 1.6开始，使用.prop（）方法提供了一种显式检索属性值的方法。

说明 -

selectedIndex，tagName，nodeName，nodeType，应检索ownerDocument，defaultChecked和defaultSelected 并使用.prop（）方法设置。在jQuery 1.6之前，这些属性可以使用.attr（）方法检索，但这不在.attr（）方法中 attr的范围。这些没有相应的属性，只是属性。

所以，你应该使用.prop（）：

检查： -

$("#fromFullDayChk").prop("checked",true);

取消检查： -

$("#fromFullDayChk").prop("checked",false);

Answer 3

以javascript方式：

// check
document.getElementById("yourCheckboxId").checked = true;

//  uncheck
document.getElementById("yourCheckboxId").checked = false;

Answer 4

尝试以下

$("#fromFullDayChk").attr("checked",true);

复选框未显示为已选中

4 个答案: