Question

此脚本旨在映射两个小隔间之间的位置，以便大型办公楼中的人可以找出他们需要去哪个地方去找那个人。我几乎得到了它......

我正在使用两个不同的下拉菜单。

默认情况下，页面上的点显示。

每个点对应于下拉列表中的名称。

当您在第一个下拉列表中选择名称时，另一个点将消失，然后如果您在另一个下拉列表中选择名称，则第一个点将消失。

我想要发生的是 - 当从下拉列表中选择两个名称时，两个点同时显示。

我可以得到一个或另一个，但不是两个。

这是JS我必须在两者之间切换......

$('#mapMe').change(function() {

        var selectedMeChoice = $('#mapMe option:selected').val();
        if (selectedMeChoice == 'ALL'){
            $('a.dot').slideDown(1000);
        }else{
            $('a.dot[mechoice = "'+selectedMeChoice+'"]').slideDown(1000);
            $('a.dot[mechoice != "'+selectedMeChoice+'"]').slideUp(1000);
        }

    });


$('#mapThem').change(function() {

        var selectedThemChoice = $('#mapThem option:selected').val();
        if (selectedThemChoice == 'ALL'){
            $('a.dot').slideDown(1000);
        }else{
            $('a.dot[themchoice = "'+selectedThemChoice+'"]').slideDown(1000);
            $('a.dot[themchoice != "'+selectedThemChoice+'"]').slideUp(1000);
        }

    });

我认为它与slideUp / slideDown函数有关，但我无法弄明白......

有一个jsfiddle here。

Answer 1

你没有以任何方式区分“他们”和“我”，所以你隐藏了应该显示的另一个。尝试这样的事情，只隐藏正确的点：

$(".me").removeClass("me");
$('a.dot[mechoice = "'+selectedMeChoice+'"]').addClass("me").slideDown(1000);
$("a.dot").not(".me, .them").slideUp(1000);

http://jsfiddle.net/XvHJS/10/

通过这种方式，您只会隐藏前一个“我”并且不会隐藏所有内容，包括活动的“他们”。

Answer 2

$('a.dot[mechoice != "'+selectedMeChoice+'"]').slideUp(1000);

还删除那些没有memchoice的内容，包括那些themchoice的内容。我建议改用不同的类dotme和dotthem。

在Javascript中禁用切换开关

2 个答案: