三级联动下拉插件waterfall封装, 效果很棒360兼容模式极速模式完美运行兼容IE,Firefox等主流浏览器^

/**
 *@Author: YingYueZhou
 *@Date: 2015/07/15
 *@Params: object
 */
;(function($){
    $.fn.waterfall = function(options){
        options = $.extend({
            nodes: options.nodes,
            title: stringFactory(options.title).key == ""?"Home":$.trim(options.title),
            firstHidden: stringFactory(options.requestParams[0]).key == ""?"firstHidden":$.trim(options.requestParams[0]),
            secondHidden: stringFactory(options.requestParams[1]).key == ""?"secondHidden":$.trim(options.requestParams[1]),
            thirdHidden: stringFactory(options.requestParams[2]).key == ""?"thirdHidden":$.trim(options.requestParams[2]),
            target: options.renderTo
        }, options);
        
        function stringFactory(param){
            return typeof param == "string"?{"key": $.trim(param)}:{"key": ""};
        };
        var data = options.nodes,
            title = options.title,
            firstHidden = options.firstHidden,
            secondHidden = options.secondHidden,
            thirdHidden = options.thirdHidden;
    
        $(options.target).click(function(){
            $(this).parent().find("input[type=‘hidden‘]").remove();
            $(this).val("");
            var $parentContainer = $(this).parent().next();
            $parentContainer.find("label > a:first").empty();
            $parentContainer.slideDown("slow");
            $parentContainer.find("label > a:first").text(title);
            var $dl = $parentContainer.children("dl");
            $dl.empty();
            for ( var i in data) {
                var id = data[i].id,
                    name = data[i].name,
                    $dd = $("<dd id=‘"+id+"‘><a href=‘javascript:void(0);‘ value=‘"+id+"‘ id=‘waterfall-"+id+"‘>"+name+"</a></dd>");
                    $dl.append($dd);
            }
            
            $("a[id^=‘waterfall-‘]").click(function(){
                $("input:hidden[name=‘"+firstHidden+"‘]").remove();
                var $one = $(this).text(),
                    $id = $(this).attr("value"),
                    $parentContainer = $(this).parent().parent().parent(), 
                $textContainer = $parentContainer
                    .prev()
                    .children(":text");
                $textContainer.val($one);
                $textContainer.before("<input type=‘hidden‘ name=‘"+firstHidden+"‘ value="+$(this).attr("value")+" >");    
                $parentContainer.find("label > a:first").text(title+"->"+$one);
                
                var $dl = $(this).parent().parent("dl");
                $dl.empty();
                $.each(data, function(i, obj){
                    if (obj.id == $id) {
                        var currentCitys = obj.children;
                        for ( var i in currentCitys) {
                            var id = currentCitys[i].id,
                                name = currentCitys[i].name,
                                $dd = $("<dd id=‘"+id+"‘><a href=‘javascript:void(0);‘ value=‘"+id+"‘ id=‘waterfall-"+id+"‘>"+name+"</a></dd>");
                                $dl.append($dd);
                        }
                    }
                });
                
                $("a[id^=‘waterfall-‘]").click(function(){
                    $("input:hidden[name=‘"+secondHidden+"‘]").remove();
                    var $two = $(this).text(),
                        $id = $(this).attr("value");
                    $textContainer.val($two);
                    $textContainer.before("<input type=‘hidden‘ name=‘"+secondHidden+"‘ value="+$(this).attr("value")+" >");
                    $parentContainer.find("label > a:first").text(title+"->"+$one+"->"+$two);
                    
                    var $dl = $(this).parent().parent("dl");
                    $dl.empty();
                    for ( var i in data) {
                        var currentCitys = data[i].children;
                        if (currentCitys != null && currentCitys != ‘‘) {
                            for ( var y in currentCitys) {
                                if (currentCitys[y].id == $id) {
                                    var grandsonNodes = currentCitys[y].children;
                                    if (grandsonNodes.length > 0) {
                                        for ( var z in grandsonNodes) {
                                            var id = grandsonNodes[z].id,
                                                name = grandsonNodes[z].name,
                                                $dd = $("<dd id=‘"+id+"‘><a href=‘javascript:void(0);‘ value=‘"+id+"‘ id=‘waterfall-"+id+"‘>"+name+"</a></dd>");
                                            $dl.append($dd);
                                        }
                                    }
                                }
                            }
                        }
                    }
                    
                    $("a[id^=‘waterfall-‘]").click(function(){
                        $("input:hidden[name=‘"+thirdHidden+"‘]").remove();
                        var $three = $(this).text();
                        $textContainer.val($three);
                        $textContainer.before("<input type=‘hidden‘ name=‘"+thirdHidden+"‘ value="+$(this).attr("value")+" >"); 
                        $parentContainer.find("label > a:first").text(title+"->"+$one+"->"+$two+"->"+$three);
                        $parentContainer.slideUp("slow");
                    });
                    
                });
                
            });
            
        });
        
        $(options.target).parent().next().find("label > a:contains(‘x‘)").on("click", function(){
            $(this).parent().parent().slideUp("slow");
        });
    };
    
})(jQuery);