jQuery / PHP: diferentes etiquetas según el valor de DIV

tengo dos divisiones <div class="number"></div> y <div class="label"></div>.

Me gustaría idear una declaración if/else, de modo que si el valor en "número" es 1, devuelva una etiqueta de, por ejemplo, "Usuario", mientras que si el número es 2 o superior, cambia a "Usuarios". ".

¿Hay alguna manera de verificar el valor de .number y luego devolver la etiqueta en función de él?

Además, habrá 5 instancias de "número" y "etiqueta" en la misma página. Cada número se devolverá consultando su valor desde una base de datos (Wordpress Custom Field Meta).

Además, la etiqueta será diferente para cada instancia, la primera podría ser "Usuarios" mientras que la segunda podría ser "Productos", etc.

¿Cómo haría lo que necesito?

Aquí hay un ejemplo de mi código:

<div class="data-item employees">
     <div class="number"><?php echo $sc_data_employees; ?></div>
     <div class="label"></div>
</div>
<div class="data-item products">
     <div class="number"><?php echo $sc_data_products; ?></div>
     <div class="label"></div>
</div>

preguntado el 03 de mayo de 12 a las 14:05

Cuando dices 'valor en número', ¿te refieres al texto, como <div>1</div>? -

Sí, será un número de texto sin formato como "20" o "3" o "1000", etc.

Entonces, ¿quieres cambiar el contenido de la etiqueta según el contenido del número? -

Sí, eso es exactamente correcto -

Este tipo de cosas debe hacerse en PHP, antes de que se entregue el documento, ya que de todos modos obtendrá los datos de una base de datos. A menos que esté usando AJAX, por supuesto. -

3 Respuestas

Tratar:

$('.number').each(function(){
    $(this).next('.label').html( ($(this).text()==1)?'user':'users');
});​​​​​​​​

Esto se ejecutará a través de todos los elementos del número de clase y cambiará la siguiente instancia de la etiqueta del elemento. Dependiendo de cómo estén organizados sus divs, es posible que deba cambiar .next() a otra función.

ejemplo de jsFiddle.

Actualización: según sus revisiones, intente esto:

$('.number').each(function(){
    var plural = $(this).parent().attr('class').split(' ')[1];
    var singular = plural.substring(0, plural.length - 1);
    $(this).next('.label').html( ($(this).text()==1)?singular:plural);
});​

ejemplo de jsFiddle.

contestado el 03 de mayo de 12 a las 15:05

¿y si quiero tener una etiqueta diferente para cada uno? Parece que funciona bien, pero me gustaría una etiqueta diferente para cada uno, por ejemplo, el primero podría ser "usuarios" mientras que el siguiente podría ser "productos". Lo siento, debería haber mencionado eso en la pregunta original: Zach Nicodemo

¿Puedes publicar el HTML que realmente estás usando? De esta manera puedo crear algo que encaje exactamente. - j08691

De acuerdo, según ese código, mi respuesta aún debería funcionar. Ejemplo jsFiddle: jsfiddle.net/j08691/UQmL4/2 - j08691

Sí, pero ¿cómo establecería un texto de etiqueta diferente para cada uno? Su muestra Fiddle tiene "usuarios" utilizados en cada uno, pero por ejemplo, según mi código anterior, la primera etiqueta debe decir empleado/empleados, y la segunda debe decir producto/productos, y así sucesivamente. Zach Nicodemo

Ooooh, no me di cuenta de que necesitabas eso. Espera, actualización en camino. - j08691

Prueba esto:

var users = parseInt($(".number").text(),10);
var label = (users == 1) ? "user" : "users";
$(".label").text(label);

Si el número de usuarios no es un número entero, como 12.3456, Utilizar parseFloat() en lugar de parseInt()

contestado el 03 de mayo de 12 a las 14:05

@Blazemonger Gracias por la solución. Creo que nos equivocamos en las ediciones de los demás mientras lo arreglábamos :). Rory McCrossan

Alternativamente, puede hacer esto antes de enviar al navegador con PHP.

$number = 1; // The number from your database

$text = ($number == 1) ? "User" : "Users"; //

$output = '<div class="number">{$number}</div>
           <div class="label">{$text}</div>';

echo $output;

contestado el 03 de mayo de 12 a las 15:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.