0

我有人帮助我,他想出了这个,效果很好。它使用来自 UL 的选项构建 3 个动态选择过滤器。

$(function() {
    renderNextLevel('#something > div > div');
});

function renderNextLevel(parent) {
    $(parent).children('ul').each(function() {
        var height = $(this).parentsUntil('#something').length;
        var current = $(parent).children('ul');
        var sel = $('.sel' + height);
        if (sel.length == 0) {
            sel = $('<select />');
            sel.attr('class', 'sel' + height);
            sel.attr('id', 'sel' + height);
            $('#something').append(sel);
            fopt =  $("<option />", {
                "value"   : "",
                "text"    : "Go to...",
            }).appendTo(sel);


            var nextLevel = function(text, idx) {
                var parents = $({});
                $('#something select').each(function() {
                    if($(this).index() > idx){
                        $(this).remove();
                    }
                });

                $('#something').find('li a').each(function() {
                    if ($(this).text() == text) {
                        parents = parents.add($(this).parent());
                    }
                });
                renderNextLevel(parents);
            };

            sel.change(function() {
                 nextLevel(sel.find('option:selected').text(), sel.index());
            });
        }

        $(this).children('li').each(function() {
            var opt = $('<option />');
            var link = $(this).children('a');
            var optVal = link.attr("href");
            var optText = link.text();
            if (sel.find('option[name="' + optText + '"]').length == 0) {
                sel.append(opt);
                opt.attr('value', optVal);
                opt.attr('name', optText);
                opt.text(optText);
            }
        });
    });
 }

我现在需要最后一个选择框选项才能在选择时转到 URL。

$("#something select").change(function() {
    window.location = $(this).find("option:selected").val();
 });

但它不起作用。有什么帮助吗?

演示http://jsfiddle.net/qjWH7/6/

4

1 回答 1

0

当您动态生成选择元素时,您应该委托事件:

$(document).on('change', "#something select", function() {
    if (this.selectedIndex == 2) {
        window.location = $(this).val();
    }
});
于 2012-07-28T18:50:39.970 回答