需要用到jQuery 的checktree插件,看了一下,但不支持默认选中的功能,还好javaeye的subwayline13同学改过了而且发表了主题:修改jquery.checktree的BUG,顺便牢骚一下jquery插件的质量令人担忧哇!!的文章,我下载下来看了一下,发现还有bug,弄完之后在发出来吧。
首先说一下,subwayline13同学改完之后的事情,首先他在那个文章里面解决的css的问题是不对的,其实很简单,只要将12行的ul.checktree li 的padding换成margin就基本差不多了,剩下的自己可以在根据需要调整一下。
然后就是改完成以后的脚本里面其实是有问题的,subwayline13同学改完之后,是可以用了。
问题是:
如果选择树在初始化时,一个有子节点的节点,而它的子节点并不是全部选中的情况下,这样这个节点本身初始化时应该就是选中的状态,在点击它的时候,他下面的子节点应该就全部成为选中状态,而自己本身也应该还是选中状态。
而subwayline13同学,改完之后,并没有改源程序里的
// Create the image for the checkbox next to the label
var $checkbox = jQuery('<div class="checkbox"></div>');
// When you click the checkbox, it should do the checking/unchecking
$checkbox.click(function() {
// Make the current class checked
jQuery(this)
// if it's half checked, its now either checked or unchecked
.removeClass("half_checked")
.toggleClass("checked")
// Send a click event to the checkbox to toggle it as well
.siblings(":checkbox").click() //这里有问题,不应该简单的是click
;
我的解决办法是删除 .siblings(":checkbox").click() ,然后放到下面的判断里面:
// Check/uncheck children depending on our status.
if (jQuery(this).hasClass("checked")) {
// Fire the check callback for this parent
if (settings.onCheck) settings.onCheck(jQuery(this).parent());
jQuery(this).siblings("ul").find(".checkbox").not(".checked")
.removeClass("half_checked")
.addClass("checked")
.each(function() {
if (settings.onCheck) settings.onCheck(jQuery(this).parent());
})
.siblings(":checkbox")
.attr("checked", "checked")
;
}
else {
// Fire the uncheck callback for this parent
if (settings.onUnCheck) settings.onUnCheck(jQuery(this).parent());
jQuery(this).siblings("ul").find(".checkbox").filter(".checked")
.removeClass("half_checked")
.removeClass("checked")
.each(function() {
if (settings.onUnCheck) settings.onUnCheck(jQuery(this).parent());
})
.siblings(":checkbox")
.attr("checked", "")
;
}
改为:
if (jQuery(this).hasClass("checked")) { //checkbox image
if (settings.onCheck)
settings.onCheck(jQuery(this).parent());
jQuery(this).siblings(":checkbox").attr("checked", "checked"); //这里是新加的
jQuery(this) //checkbox image
.siblings("ul")//checkbox image >ul
.find(".checkbox")//checkbox image >ul >all checkbox image
.not(".checked")
.removeClass("half_checked")
.addClass("checked")
.each(function() {
if (settings.onCheck)
settings.onCheck(jQuery(this).parent());
}).siblings(":checkbox")//checkbox image >ul >all checkbox
.attr("checked", "checked");
} else {
// Fire the uncheck callback for this parent
if (settings.onUnCheck)
settings.onUnCheck(jQuery(this)
.parent());
jQuery(this).siblings(":checkbox").attr("checked", "");//这里是新加的
jQuery(this)
.siblings("ul")
.find(".checkbox")
.filter(".checked")
.removeClass("half_checked")
.removeClass("checked")
.each(function() {
if (settings.onUnCheck)
settings.onUnCheck(jQuery(this).parent());
}).siblings(":checkbox")
.attr("checked", "");
}
这样就ok了。如果还有人发现问题,希望通知我一声呀。
弄成资源了,之前没有列子,不好意思了,现在补充上.想要的下载吧。