jQuery 选择与其他人共享类的单个 Div

Posted 2023-05-09

【中文标题】jQuery 选择与其他人共享类的单个 Div

【英文标题】：jQuery select a single Div that shares class with others

【发布时间】：2014-04-25 18:57:50

【问题描述】：

我真的希望你能帮助我，因为我搜索了其他几个问题，但没有解决方案对我有帮助。问题是：我正在构建一个投资组合网站，单击一个 div 会打开一个更大的 div，其中包含更多信息。那些较小的 div 共享同一个类 - 我如何告诉 jQuery 只向其中包含“触发器”的 div 添加一个类？

我的 javascript 看起来像这样：

$( document ).ready(function() 
$('#moreinfo').addClass('hidden');
$('.portfoliotile p').addClass('hidden');
$('.portfoliotile h1').addClass('hidden');

 $('.trigger').click(function()
            $('#moreinfo').removeClass('hidden');
            $(this).parent().addClass('dark');
        );

$('#closegall').click(function()
            $('#moreinfo').addClass('hidden');
            $('.portfoliotile').removeClass('dark');
        );
);

真的希望你能帮助我，欢迎关注THIS FIDDLE

【参考方案1】：

你想改变相对于 this 的祖先，因为在处理程序中，this 是被点击的元素：

您通常应该使用 closest 而不是 parent，因为它更能容忍 DOM/布局更改。

例如

    $(this).closest('.portfoliotile').addClass('dark');

JSFiddle：http://jsfiddle.net/TrueBlueAussie/632Fw/164/

由于 jQuery 支持隐藏和显示，我建议使用它的方法（hide/show、fadeIn/fadeout、slideDown/slideUp 等）。