¿cómo seleccionar toda la clase excepto el elemento pulsado en jQuery?


Tengo un sitio web desarrollado en Drupal. Utilizo un módulo llamado collapsiblock (es básicamente un plugin de jQuery) para lograr el efecto de acordeón. Está funcionando bien conmigo (aunque está en beta). Pero quiero modificarlo para que cuando el usuario haga clic en un elemento del acordeón, los otros elementos se colapsen.

En sus estadísticas actuales, está funcionando de una manera que cuando el usuario haga clic en un elemento, comprobará si el elemento ya está contraído o expandido y hará que el elemento sea el opuesto. Eso significa que si el usuario hace clic en un elemento se expandirá y si hace clic en otro elemento también se expandirá, pero no colapsará el elemento previamente pulsado.

Puede ver el código a continuación. Sé dónde debo agregar el código para colapsar y cómo colapsar y expandir. Mi pregunta es: ¿Cómo selecciono todos los elementos que tienen la clase '.collapsiblock ' excepto en el que el usuario ha hecho clic??

Nota: el elemento que tiene la clase '.No hay comentarios colapsado y si esta clase se elimina del elemento se expande.

// $Id: collapsiblock.js,v 1.6 2010/08/18 19:17:37 gagarine Exp $

Drupal.Collapsiblock = Drupal.Collapsiblock || {};

Drupal.behaviors.collapsiblock = function (context) {
  var cookieData = Drupal.Collapsiblock.getCookieData();
  var slidetype = Drupal.settings.collapsiblock.slide_type;
  var defaultState = Drupal.settings.collapsiblock.default_state;
  var slidespeed = parseInt(Drupal.settings.collapsiblock.slide_speed);
  $('div.block:not(.collapsiblock-processed)', context).addClass('collapsiblock-processed').each(function () {
    var id = this.id;
    var titleElt = $(':header:first', this).not($('.content :header',this));
    if (titleElt.size()) {
      titleElt = titleElt[0];
      // Status values: 1 = not collapsible, 2 = collapsible and expanded, 3 = collapsible and collapsed, 4 = always collapsed
      var stat = Drupal.settings.collapsiblock.blocks[this.id] ? Drupal.settings.collapsiblock.blocks[this.id] : defaultState;
      if (stat == 1) {
        return;
      }

      titleElt.target = $(this).find('div.content');
      $(titleElt)
        .addClass('collapsiblock')
        .click(function () {
          var st = Drupal.Collapsiblock.getCookieData();
          if ($(this).is('.collapsiblockCollapsed')) {
            $(this).removeClass('collapsiblockCollapsed');
            if (slidetype == 1) {
              $(this.target).slideDown(slidespeed);
            }
            else {
              $(this.target).animate({height:'show', opacity:'show'}, slidespeed);
            }

            // Don't save cookie data if the block is always collapsed.
            if (stat != 4) {
              st[id] = 1;
            }
          } 
          else {
            $(this).addClass('collapsiblockCollapsed');
            if (slidetype == 1) {
              $(this.target).slideUp(slidespeed);
            }
            else {
              $(this.target).animate({height:'hide', opacity:'hide'}, slidespeed);
            }

            // Don't save cookie data if the block is always collapsed.
            if (stat != 4) {
              st[id] = 0;
            }
          }
          // Stringify the object in JSON format for saving in the cookie.
          var cookieString = '{ ';
          var cookieParts = [];
          $.each(st, function (id, setting) {
            cookieParts[cookieParts.length] = ' "' + id + '": ' + setting;
          });
          cookieString += cookieParts.join(', ') + ' }';
          $.cookie('collapsiblock', cookieString, {path: Drupal.settings.basePath});
        });
      // Leave active blocks uncollapsed. If the block is expanded, do nothing.
      if (stat ==  4 || (cookieData[id] == 0 || (stat == 3 && cookieData[id] == undefined)) && !$(this).find('a.active').size()) {
        $(titleElt).addClass('collapsiblockCollapsed');
        $(titleElt.target).hide();
      }
    }
  });
};

Drupal.Collapsiblock.getCookieData = function () {
  var cookieString = $.cookie('collapsiblock');
  return cookieString ? Drupal.parseJson(cookieString) : {};
};

ACTUALIZACIÓN:

El problema se ha resuelto añadiendo el siguiente código:

$('.collapsiblock').not(this).each(function(){
                $(this).addClass('collapsiblockCollapsed');
                $(this.target).animate({height:'hide', opacity:'hide'}, slidespeed);
             });

Justo encima de la siguiente línea:

$(this).removeClass('collapsiblockCollapsed');
Author: Hassan Al-Jeshi, 2010-08-26

3 answers

Utilice el not selector.

Ejemplo:

$('.collapsiblock').click(function(){
     $('.collapsiblock').not(this).each(function(){
         $(this).slideUp();
     });
     $(this).slideDown();
})
 142
Author: Kristoffer Sall-Storgaard,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-01-16 19:21:38

Prueba esto,

Ejemplo:

$('.collapsiblock').click(function(){
   $('.collapsiblock').not(this).slideUp();
   $(this).slideDown();
});

Esta es la mejor manera porque si se utiliza cada función por lo que se cargará y en el futuro tiene más de miles div por lo que tomará mucho tiempo para deslizarse o slideDown.

 3
Author: Bhavik Hirani,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-08-13 03:58:36

Puede realizar un seguimiento de qué elemento ya se ha hecho clic con su propio controlador de clics de jquery y los datos de jquery(...) función. A continuación, filtrar iterar su .collapsiblock elementos con el filtro de jquery (...) función para incluir los elementos que necesita.

 2
Author: Adrian Grigore,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-08-26 05:20:48