objetivo anterior $ this

Question

Cómo apuntar $ this (desde el contexto 'cada') desde la función 'clic'. Quiero eliminar el incómodo código .parents(). Find().

$('.layout.responsive').each(function() { 
    $('.area.optional', this).before('<a href="#" class="toggle_responsive" onClick="return false">Show details</p>').hide(); 
    $('.toggle_responsive', this).click(function() { 
     $(this).parents('.layout.responsive').find('.area.optional').toggle(); 
    }); 
}); 

Answer 1

La solución es, por supuesto, lo mismo que todos los demás está aquí, pero creo que con esta sintaxis es mucho más limpio y va a lograr lo mismo que el código que estás usando en este momento.

$('.layout.responsive').each(function() { 
    var ar = $(this).find('.area.optional').hide(), 
     showDetail = $('<a />', { 
     href: '#', 
     class: 'toggle_responsive', 
     text: 'Show details', 
     click: function(){ 
      ar.toggle(); 
      return false; 
     }}).insertBefore(ar); 
}); 

En lugar de insertar en una cadena HTML, podemos utilizar la nueva sintaxis introducida en jQuery 1.4 para hacer esto mucho más limpia, y sin el controlador de eventos en línea desordenado que está usando en este momento.

Answer 2

Simplemente puede almacenar en una variable:

$('.layout.responsive').each(function() { 
    var $elem = $('.area.optional', this).before('<a href="#" class="toggle_responsive">Show details</p>').hide(); 
    $('.toggle_responsive', this).click(function(e) { 
     e.preventDefault(); 
     $elem.toggle(); 
    }); 
}); 

También tenga en cuenta la llamada e.preventDefault(); lo que hace más o menos lo que su onclick="return false;" hicieron pero de una manera mucho más limpia.

Answer 3

guardarlo en un (no especiales) variable llamada:

$('.layout.responsive').each(function() { 
    var area = $('.area.optional', this).before('<a href="#" class="toggle_responsive" onClick="return false">Show details</p>').hide(); 
    $('.toggle_responsive', this).click(function() { 
     $(area).toggle(); 
    }); 
});