2009-01-25 12 views

Respuesta

94

Si está haciendo esto en varios campos, o lo hace con bastante frecuencia, entonces tal vez un complemento sea la respuesta.
Aquí está el comienzo de un plugin jQuery que formatea el valor de un campo con dos decimales.
Se desencadena por el evento onchange del campo. Es posible que desee algo diferente.

<script type="text/javascript"> 

    // mini jQuery plugin that formats to two decimal places 
    (function($) { 
     $.fn.currencyFormat = function() { 
      this.each(function(i) { 
       $(this).change(function(e){ 
        if(isNaN(parseFloat(this.value))) return; 
        this.value = parseFloat(this.value).toFixed(2); 
       }); 
      }); 
      return this; //for chaining 
     } 
    })(jQuery); 

    // apply the currencyFormat behaviour to elements with 'currency' as their class 
    $(function() { 
     $('.currency').currencyFormat(); 
    }); 

</script> 
<input type="text" name="one" class="currency"><br> 
<input type="text" name="two" class="currency"> 
+0

Hola, me gustaría saber si necesitamos otro complemento para currencyFormat()? .. –

+0

¿Funciona esto en IE? Lo tengo trabajando en Chrome y FF pero no en IE ... – Rexxo

57

Tal vez algo como esto, ¿dónde podría seleccionar más de un elemento si lo desea?

$("#number").each(function(){ 
    $(this).val(parseFloat($(this).val()).toFixed(2)); 
}); 
+22

En una nota lateral, no debería haber duplicados de identificación en su dom. Considera cambiar 'número' a una clase. – gradbot

+1

@gradbot - nada de esto implica que haya más de un elemento con id = "número". Parece que svinto solo está usando la función "cada" como una forma de reducir el número de veces que aparece la cadena mágica "#number" en el código. Es una mejora pequeña (y buena, creo) en el código de LainMH. Si este formato solo necesita hacerse en una página, esta es la forma en que preferiría hacerlo. Si necesita ser duplicado en más de una página, entonces prefiero el método de complemento de meouw, excepto extraerlo a un archivo javascript externo. –

+0

@ DanielSchilling ... supongo que lo que estaba tratando de decir el gradbot era que si desea aplicar la misma función en un cuadro de entrada múltiple en una sola página tampoco puede proporcionar la misma identificación o no puede seguir mencionando la identificación de cada cuadro de entrada como este '('# num1, # num2'). cada uno (función() {});' .Por lo tanto, sería mejor usar un enfoque de clase como este '('.number'). each (function() {}); '.Y proporcione a cada cuadro de entrada una clase común -número –

3

Modificamos una función Meouw para usar con la tecla, ya que cuando usa una entrada puede ser más útil.

Comprobar esto:

Hola !, @heridev y creó una pequeña función de jQuery.

Puede probar la próxima:

HTML

<input type="text" name="one" class="two-digits"><br> 
<input type="text" name="two" class="two-digits">​ 

jQuery

// apply the two-digits behaviour to elements with 'two-digits' as their class 
$(function() { 
    $('.two-digits').keyup(function(){ 
     if($(this).val().indexOf('.')!=-1){   
      if($(this).val().split(".")[1].length > 2){     
       if(isNaN(parseFloat(this.value))) return; 
       this.value = parseFloat(this.value).toFixed(2); 
      } 
     }    
     return this; //for chaining 
    }); 
}); 

demostración en línea:

http://jsfiddle.net/c4Wqn/

(@heridev, @vicmaster)

Cuestiones relacionadas