Question

在这个问题上与我裸露，我正在努力尝试在一个单独的div容器中创建一个链接，在一个完全不同的div容器中打开一个面板（如果你点击第二个div容器链接，面板也会打开，链接本身有一个活动状态） - 我得到了部分，如果我点击第一个div容器中的链接，面板从第二个div容器打开，但我正在努力使第一个div容器链接激活活动在第二个div容器中的状态...

如果您查看演示，只需单击{ÑØ§}成员选项卡，因为其他2个处于非活动状态...单击该选项卡后，将打开一个面板（不是我正在说话的面板）虽然如此;该面板是打开的，看看底部，在div容器的左侧，其中包含信息标题：“Official Roster”，其中有一个链接显示“rank”，如果点击该特定链接， OF面板打开就像它应该的那样，但是，活动状态选择它们而不仅仅是选择的那个...我已经接近了，但我严重陷入困境，似乎无法弄明白...

演示：http://jsfiddle.net/Djdzw/2/

我相信这是纯粹的javascript，但是，它也可能是css。我将在下面提供我所拥有的代码，但是 - 我只提供javascript，因为发布所需的所有代码只会太多...所以，如果你只是看一下上面的演示，它可能更容易在眼睛上;）

JAVASCRIPT：

/ * =====以下部分是需要编辑的内容===== * /

$('.info_box p a').click(function () {
    var a = $('#profile_list a');
    $('#profile_list a').removeClass('active');
    $('#profile_list a').addClass('active');
});

Answer 1

你的意思是？

$('.info_box p a').click(function () {
    var id = this.id; //get the id of the clicked item
    var a = $('#profile_list a[href="#' + id +'"]'); //construct the selector to select the menu item which has the same href
    $('#profile_list a').not(a.addClass('active')).removeClass('active'); //now do the add/remove class

});

<强> Fiddle

Answer 2

我做到了这一点并且有效。我希望这是你正在寻找的东西：

$('.info_box p a').click(function () {
    var a = $('#profile_list a');
    $('#profile_list a').removeClass('active');
    $('#profile_list a.panel[href=' + $(this).attr('href') + ']').addClass('active');
});

jsFiddle

Javascript无法正常工作 - 2个不同的div容器

2 个答案: