编写这个jquery的更好方法

Question

到目前为止，这个jquery代码适用于我想要它做的事情。基本上，当用户点击图像时，它会淡出这些Div，然后淡入需要显示的那个：

$('.brother').click(function() {
        $("#mitsu-gallery:visible, .mitsu-tag:visible, #taki-gallery:visible, .taki-    tag:visible").fadeOut("slow", function() {
             $("#brother-gallery, .brother-tag").fadeIn("slow");
        });
     });

但我想知道是否有更好的方法来做这个而不是列出我想要隐藏的所有Div？或者这只是实现这一目标的最佳方式？

Answer 1

在要隐藏的所有DIVs上使用一个班级。

E.g。

<div id="mitsu-gallery" class="hideme">Content</div>

并且

$('.hideme').fadeOut(blah, blah);

修改

在审核your Fiddle之后，这是您的最佳选择：

$('.control').on('click', function (e) {
    e.preventDefault();
    var field = $(this).data('field');
    $('.hider:visible').fadeOut("slow", function () {
        $('#' + field + '-gallery, #' + field + '-tag').fadeIn("slow");
    });
});

请还要审核此FIDDLE

上的HTML和CSS更改