Simulation of multistage checkbox effect --jquery

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Today and feel the power of jQuery, a multilevel checkbox effect, code in total 20+ over.

I also want to use the JS to do a have a look, just write a few methods can't write, compatibility must consider many, but the amount of code straight up.

To achieve the main share this effect of jQuery under the. Code block two block:

One is the full effect, click the check box is selected when its descendants are corresponding is selected or not selected. This is very good, the code as follows:

evtEle.parent().next(".checks").find("input:checkbox").attr("checked", evtEle[0].checked);//EvtEle is to click the check box

The two is the check box the parent frame according to the current frame's brother is chosen to decide whether the selected parent frame, and then continue to look up the parent frame parent frame etc.

When the selected here the implementation uses parents to get all of the parent frame, for each operation combined with each to complete the.

When the non selected parent frame selected are lost. The following code:

                if (evtEle.is("input:checked")) {
                    evtEle.parents(".checks").each(function () {
                        !$(this).children("p").children("input:checkbox").filter(function () {
                            return !this.checked;
                        })[0] && $(this).prev().children("input:checkbox").attr("checked", "checked");
                    });
                } else {
                    evtEle.parents(".checks").prev().children("input:checkbox").attr("checked", false);
                }

Demo download

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Warren at November 20, 2013 - 12:52 PM