Necesito tu ayuda con algo que debería ser sencillo, espero 🙂

Tengo este código html:

<div>div text</div>
<p>p text</p>
<span>span text</span>
<h1>h1 text</h1>
<ul>
  <li>some li text</li>
  <li>more li text</li>
</ul>

Necesito jQuery a color del texto seleccionado en rojo cada vez que el elemento se ha hecho clic. Ahora, puede haber otros elementos también, así que tenlo en cuenta. Además, sólo el elemento seleccionado debe cambiar el color.

Como un ejemplo aquí es un código simple que hará exactamente lo que necesito, pero sólo para el elemento div:

  $('div').click(function() {
    $(this).css({'color':'red'}); 
  });

¿Qué es el código más sencillo tener la misma funcionalidad de todos los elementos de html.

Gracias!

  • No debería ser su respuesta. Usted debe aceptar uno de los siguientes soluciones que mejor te parezca.
InformationsquelleAutor Klikerko | 2011-04-25

2 Comentarios

  1. 7

    css:

    .highlight
    {
       color: #f00;
    }

    javascript:

    $('*').click(function(e) {
      $('*').removeClass('highlight');
      $(this).addClass('highlight');
      e.stopPropagation();
    });

    La primera llamada elimina la clase de todo lo que en caso de que ya fue resaltada. De esa manera, sólo un elemento a la vez está resaltado.

    • Gracias a Geoff, esto funciona perfecto!
  2. 8

    ¿

    $('*').click(function(e) {
      $(this).css('color', 'red');
      e.stopPropagation();
    });

    He incluido en la llamada a «stopPropagation()» para asegurarse de que todo no se enciende de color rojo debido a la propagación de los eventos.

    Por supuesto, si usted sólo desea este efecto dentro de algún contenedor, puede cambiar el inicial selector de «*» (cada elemento en el DOM) a algo así como «#containerId *», para llegar a cada elemento en el contenedor.

    editar — me gusta @Geoff respuesta – es mucho más clase 🙂

    • Gracias Puntiaguda, stopPropagation() era la pieza que faltaba en mi código 🙂
    • +1 para limitar a un contenedor en lugar de simplemente seleccionar todo
    • +1 a los dos por ser tan increíble y rápido.

Dejar respuesta

Please enter your comment!
Please enter your name here