2011-01-17 11 views
11

Estoy intentando escribir una instrucción if/else en JQuery que puede cambiar la clase de un elemento haciendo coincidir 'IN' o 'OUT' (en este caso).JQuery instrucción if/else que coincide con un nombre CSS comodín

Por ejemplo, tengo varios <DIV> con class='IN-something' O class='OUT-something'.

Lo siguiente funcionaría si supiera la clase exacta de CSS, pero lo único que sabré es que contiene 'IN' o 'OUT'.

Así que algo como esto:

if ($(jRow).hasClass('IN-*')) 
{jRow.attr("class", "OUT-foo");} 
else 
{jRow.attr("class", "IN-foo");} 

ideas? Gracias!

Respuesta

7
if ($(jRow).attr('class').indexOf('IN-') !== 1) 
    {jRow.attr("class", "OUT-foo");} 
else 
    {jRow.attr("class", "IN-foo");} 
+0

Como solo quieres una respuesta booleana, 'search' es el método apropiado aquí. Sin embargo, su enfoque funcionará bien en este caso, siempre que la cadena coincidente continúe evaluando en verdadero. –

+0

¿Por qué votar abajo? – Sarfraz

+0

De acuerdo ... esta respuesta es totalmente legítima (como es la mía), y ambos obtuvimos los votos. Yo voté, Sarfraz. Sospecho que alguien (¿el Sr. Kendall?) Es demasiado competitivo. –

0
var class = $(jRow).attr('class'); 
if (class.search("IN\-.*")) { 
    jRow.attr("class", "OUT-foo"); 
} 
else { 
    jRow.attr("class", "IN-foo"); 
} 
+0

¿De verdad? Dos votos abajo, solo para responder la pregunta real del tipo con precisión. –

+0

+1 respuesta válida – hunter

+1

bien, si obtiene votos a la baja, tenga en cuenta lo siguiente: 1. [la diferencia entre búsqueda e indexOf] (http://stackoverflow.com/questions/354110/in-javascript-what-is-the- difference-between-indexof-and-search) -> indexOf es más apropiado aquí porque no necesitamos expresiones regulares aquí. 2. la búsqueda devuelve -1 en no encontrado y -1 convertido en booleano da verdadero, por lo que su respuesta nunca puede funcionar. 3. en las expresiones regulares, los guiones no necesitan ser escapados porque las clases de caracteres externas no tienen un significado especial. Con 3 defectos y mejores respuestas disponibles, sería mejor que borre su respuesta. – nus

1

datos de uso de jQuery para almacenar "IN" o "OUT", o añadir un atributo de su cuenta con un nombre de lógica de negocio apropiado que dice "IN" o "OUT". El problema real aquí es combinar nombres de clase.

También puede acceder al IN y OUT y utilizar múltiples clases.

<tr class = "IN foo"/>

if($obj.hasClass("in")){ $obj.removeClass("in").addClass("out") } 
+2

¿De verdad? Abajo-votos para dos respuestas legítimas, solo para promocionar el tuyo? Venga. –

+2

No voté pero el "Lo estás haciendo mal" nunca es útil – hunter

+0

@dorkitude - ¿Cómo puedes saber quién votó negativamente? Me pregunto ... ¡Voy a votar a todos para que dejen de lloriquear sobre sus puntos imaginarios! – hunter

7

se puede utilizar el attribute-contains-prefix-selector(docs) si eso será todo el valor de la clase (o al menos esa es la primera clase).

if ($(jRow).is('[class |= IN]')) { 

Esto también utiliza el método is()(docs) para ver si es un partido jRow.

Click here to test a working example.(jsFiddle)


EDIT:

Si el punto es que usted no sabe lo que es foo, y que necesita para retenerlo, me gustaría hacer algo como esto en su lugar:

jRow.attr('class', function(i,cls) { 
    return cls.indexOf('IN') > -1 ? cls.replace('IN','OUT') : cls.replace('OUT','IN'); 
}); 

puede pasar una función como segundo argumento al método attr()(docs). Esa función tiene 2 parámetros. El primero es el índice actual en la iteración. El segundo es el valor actual del atributo.

El valor de retorno es el valor que se establecerá.

+1

+1 que es inteligente :) – Sarfraz

+0

V Clever: en mi aplicación, estoy reemplazando 'foo' a propósito en este caso, pero ese es un código útil. – Neokoenig

Cuestiones relacionadas