Question

我对此不以为然。

这应该是一件容易的事，但是Chrome很糟糕。我有2个列表框区域和区域。这个想法只是在选择区域时显示区域。它在Firefox中运行良好，但在Chrome中运行不正常。经过反复试验后，我发现如果列表框选项减少了它的工作但有很多选项它只能在Chrome中运行，另一个浏览器就可以了。

请在粘贴箱中查看脚本。有2个列表框版本。评论工作版本。

http://pastebin.com/jt8JwFj4

谢谢

Answer 1

我有另一种解决方案，请检查此fiddle

的javascript

   $(document).ready(function(){                
            $("#fstarted-region").change(function() {
                var reg = $("#fstarted-region :selected").val();
                if(reg==''){
                    $("#fstarted-areas").hide();
                }else{
                    $("#fstarted-areas").show();
                    $("#fstarted-areas option").hide();
                    $("#fstarted-areas option."+reg).show();
                }

            });

        });

CSS

 #fstarted-areas option {
display: none;
}

#fstarted-areas{
display: none;
}
#fstarted-areas option.always {
display: none;
}

Answer 2

Webkit浏览器让它的对象与CSS样式有点隔离。这意味着你无法做像.show（），。hide（）等类似的东西。

预计会有一些.detach()和.append()来电，或者只是开始使用模板引擎。

您在jsFiddle中调用了.fadeIn()，假设您希望它隐藏在第一位。

HTML：

<select id="fstarted-areas" style="display: none">

使用Javascript：

$(document).ready(function() {
    // Get hold of all options
    var areaOptions = $("#fstarted-areas option");

    $("#fstarted-region").change(function() {
        // Also with a multiple selection I assume you need to get ALL 
        // selected instead of the first one.
        var regs = $("#fstarted-region :selected").map(function(i, el) {
            return '.' + $(el).val();
        });

        regs = $.makeArray(regs);

        // Detach all options, chain the search option.
        regs = areaOptions.detach().filter(regs.join(', '));

        // Add options into selection, then show it.
        $("#fstarted-areas").append(regs).fadeIn(500);
    });
});

仅在Chrome浏览器中出现JQuery Listbox奇怪错误

2 个答案: