如何在IE6上进行jquery操作和框检查/取消选中工作?

时间:2009-12-18 13:54:35

标签: jquery internet-explorer-6

在下一页(参见结尾处的代码)当我点击“A”复选框时,在大多数浏览器中,它都在水平规则下,未经检查。 在IE6上,它遵循水平规则,但保持检查。 我希望IE6中的行为与其他浏览器中的行为相同。 我试着添加

$(this).attr({"checked":"unchecked"});

但并不是更好。 任何解决方案?

以下是该页面的代码:

<html>
<head>

<title>test check</title>

<script src="shoppinglist_fichiers/jquery-1.js"></script>
<script type="text/javascript">

var toggleItem = function(o, toUnbind, toBind){
    var selector = $(o);
    selector.unbind("click", toUnbind);
    selector.bind("click", toBind);
};

var checkItem = function(){
    toggleItem(this, checkItem, uncheckItem);
    //$(this).attr({"checked":"checked"});
    $("#checked").prepend($(this).parent());
};

var uncheckItem = function(){
    toggleItem(this, uncheckItem, checkItem);
    //$(this).attr({"checked":"unchecked"});
    $("#unchecked").append($(this).parent());
};

$(document).ready(function(){
    $("#checked input").bind("click", uncheckItem);
    $("#unchecked input").bind("click", checkItem);
});

</script>

</head>
<body>
<form id="listForm" action="list" method="post">
<span id="checked">

        <span id="A"> 
        <input autocomplete="off" value="A" name="list" checked="checked" type="checkbox">A<br>
        </span>
</span>
<hr/>
<span id="unchecked">

</span>
</form>

</body>
</html>

4 个答案:

答案 0 :(得分:3)

checked是XHTML中的布尔属性。在您的XHTML中,您将属性写为checked="checked",javascript将此属性公开为布尔值element.checked

使用truefalse选中或取消选中复选框。

$(this).attr('checked', true);  //Check
$(this).attr('checked', false); //Uncheck

或者,您也可以删除该属性以取消选中该框。

$(this).removeAttr('checked');  //Uncheck

将它设置为无效值不会取消选中IE6中的框(坦率地说,奇怪的是,它是该方面唯一的浏览器规范。任何字符串仍然是true而不是空{{1} }})。

  

checked Property (INPUT type=checkbox, INPUT type=radio, HTMLInputElement Constructor)

答案 1 :(得分:2)

在IE6中使用属性defaultChecked。

这应该有效

var checkItem = function(){
 toggleItem(this, checkItem, uncheckItem);
 //$(this).attr({"checked":"checked"});
 $(this).attr({"defaultChecked":true});
 $("#checked").prepend($(this).parent());
};

var uncheckItem = function(){
 toggleItem(this, uncheckItem, checkItem);
 //$(this).attr({"checked":"unchecked"});
 $(this).attr({"defaultChecked":false});
 $("#unchecked").append($(this).parent());
};

答案 2 :(得分:0)

我理解你的问题有点困难,但是用jQuery取消选中,只需使用:

$(this).removeAttr('checked');

答案 3 :(得分:0)

这似乎是带有checkbox + document-fragment 的 IE6错误(当你执行附加内容时,jQuery会在内部使用该片段)

检查此页面以获取整个不一致列表的描述

DOM & checkbox(checked status)


虽然我还不完全确定为什么会这样,但你可以使用这个工作量 与此同时。

var checkItem = function(){
    var ele = $(this).parent().clone(true);
    toggleItem(ele.find("input").get(0), checkItem, uncheckItem);
    ele.prependTo($("#checked"));
    $(this).parent().remove();
};

var uncheckItem = function(){
    var ele = $(this).parent().clone(true);
    toggleItem(ele.find("input").get(0), uncheckItem, checkItem);
    ele.appendTo($("#unchecked"));
    $(this).parent().remove();
};

顺便说一句。如果您使用toggleItem

,可以缩短代码(+删除live
var helper = function(elem, container) {
    var par = $(elem).parent();
    if(container.attr("id") == "unchecked")
        par.clone(true).prependTo(container);
    else
        par.clone(true).appendTo(container);
    par.remove();
}

var checkItem = function(){
    helper(this, $("#checked"));
};

var uncheckItem = function(){
    helper(this, $("#unchecked"));
};

$(document).ready(function(){
    $("#checked input").live("click", uncheckItem);
    $("#unchecked input").live("click", checkItem);
});