Question

当一个元素打开时，所有其他元素都会打开元素。

我有这段代码：

jQuery(document).ready(function() {
    jQuery('#servico1').click(function() {
            jQuery('.descricao2').hide("slow");
            jQuery('.descricao3').hide("slow");
            jQuery('.descricao4').hide("slow");
            jQuery('.descricao1').slideToggle("slow");
    });
    jQuery('#servico2').click(function() {
            jQuery('.descricao1').hide("slow");
            jQuery('.descricao3').hide("slow");
            jQuery('.descricao4').hide("slow");
            jQuery('.descricao2').slideToggle("slow");

    });
    jQuery('#servico3').click(function() {
            jQuery('.descricao2').slideToggle("slow");
    });
    jQuery('#servico4').click(function() {
            jQuery('.descricao3').slideToggle("slow");
    });
});

我知道它的代码很糟糕且非常重复。我想知道如何创建更简单，更清晰的代码。

FIDDLE

Answer 1

这是你可以做的。

1）对所有锚元素使用单击处理程序

2）在同一div中的锚元素之间使用单击的锚索引来定位所需的div。

3）slideToggle有针对性的div并隐藏其兄弟div。

$('a.d-box-effect7-menu').click(function(){
   $('.descricao'+($('.d-box-effect7-menu').index($(this))+1)).slideToggle("slow").siblings('div').hide('slow');
});

slideToggle（）多个元素显示/隐藏

1 个答案:

Working Demo