Skip to main content
se añadieron 390 caracteres en el cuerpo
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar el formato de pesos argentinos, es decir, signo $, punto como separador de miles y coma como separador de decimales.

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-AR', {
    style: 'currency',
    currency: 'ARS'
  }).format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplicointenté aplicar lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales pero está incompleto ya que le falta considerar varios casos como el que usuario cambie el punto de inserción de texto o que quiera escribir un centavo (0,01).

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Muy probablemente la solución sea adoptar una librería para enmascarar entrada que incluya el formato de moneda deseado o bien que permita personalizarlo.

Preguntas relacionadas

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar el formato de pesos argentinos, es decir, signo $, punto como separador de miles y coma como separador de decimales.

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-AR', {
    style: 'currency',
    currency: 'ARS'
  }).format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar el formato de pesos argentinos, es decir, signo $, punto como separador de miles y coma como separador de decimales.

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-AR', {
    style: 'currency',
    currency: 'ARS'
  }).format(numero);
<div id="salida"></div>

En el siguiente ejemplo intenté aplicar lo anterior para permitir que un input agregue automáticamente el separador de miles y permita la inclusión de decimales pero está incompleto ya que le falta considerar varios casos como el que usuario cambie el punto de inserción de texto o que quiera escribir un centavo (0,01).

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Muy probablemente la solución sea adoptar una librería para enmascarar entrada que incluya el formato de moneda deseado o bien que permita personalizarlo.

Preguntas relacionadas

se añadieron 151 caracteres en el cuerpo
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar el formato de pesos argentinos, es decir, signo $, punto como separador de miles y coma como separador de decimales.

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-ES'AR', {
    style: 'currency',
    currency: 'ARS'
  }).format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar punto como separador de miles

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-ES').format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar el formato de pesos argentinos, es decir, signo $, punto como separador de miles y coma como separador de decimales.

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-AR', {
    style: 'currency',
    currency: 'ARS'
  }).format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Se agregó un segundo ejemplo
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar punto como separador de miles

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-ES').format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar punto como separador de miles

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-ES').format(numero);
<div id="salida"></div>

Como mencioné en mi respuesta a otra pregunta similar,

Hoy día, la mayoría de los navegadores modernos soportan Intl.NumberFormat lo cual nos ayuda a dar formato a un número sin necesidad de recurrir a expresiones regulares ni a funciones específicas de jQuery.

En la liga anterior, al final de la página se incluye la compatibilidad con navegadores de escritorio, móviles y servidor.

A continuación el ejemplo que incluí en la respuesta referida, adaptado para mostrar punto como separador de miles

var numero = 1E6 + 56 / 100; //Un millón y 56 centésimas
document
  .getElementById('salida')
  .innerHTML = new Intl.NumberFormat('es-ES').format(numero);
<div id="salida"></div>

En el siguiente ejemplo aplico lo anterior para permitir que un input reciba agregue automáticamente el separador de miles y permita la inclusión de decimales.

var monto = document.querySelector('input');
var options = {
    style:'currency',
  currency:'ARS',
  minimumFractionDigits:0
};
monto.addEventListener('input',function(){
  // Si el último caracter es una coma, deberemos agregarla
  var separador = (this.value.substr(this.value.length - 1,1)===',')?',':''; 
    var monto1 = this.value
  .replace(/[^\d,]/g,"") //remover $ punto y otros caracteres no validos
  .replace(",","."); // JavaScript usa punto como separador decimal para los números,entonces reemplazamos la coma por un punto
  this.value = Intl.NumberFormat('es-AR',options).format(monto1)
  + separador; // Si el último caracter es una coma, agregarlo.
});
<input type="text" placeholder="$ 10.000">

Agregar ejemplo
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85
Loading
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85
Loading