Javascript, como mostrar unicamente dos decimales

publicado por: Anonymous

Quiero que al hacer el calculo me aparezcan dos decimales, ya que por ejemplo ingreso la cantidad 100 y al calcular en los demás campos aparecen muchos decimales. Ya intente hacerlo con .toFixed(2) y no logro hacer que funcione.

Ilustración y código:

introducir la descripción de la imagen aquí

_x000D_

_x000D_

//funcion que se ejecuta cada vez que se añade una letra en un cuadro de texto_x000D_
//suma los valores de los cuadros de texto_x000D_
_x000D_
function sumar()_x000D_
{_x000D_
    var dolar = 18;_x000D_
	var porcentaje = 100;_x000D_
	var valor1=verificar("valor1");_x000D_
	var valor2=verificar("valor2");_x000D_
	var valor3=verificar("valor3");_x000D_
	var valor4=verificar("valor4");_x000D_
	var valor5=verificar("valor5");_x000D_
	x = parseFloat(valor1);_x000D_
	y = parseFloat(valor1)/parseFloat(dolar);_x000D_
	z = parseFloat(valor1)/porcentaje*10/parseFloat(dolar);_x000D_
	f = parseFloat(y)+parseFloat(z);_x000D_
_x000D_
	// realizamos la suma de los valores y los ponemos en la casilla del_x000D_
	// formulario que contiene el total_x000D_
_x000D_
	document.getElementById("valor2").value= x;_x000D_
	document.getElementById("valor3").value= y;_x000D_
	document.getElementById("valor4").value= z;	_x000D_
	document.getElementById("valor5").value= f;_x000D_
}_x000D_
_x000D_
//funcion para verificar los valores de los cuadros de texto. si no es un valor_x000D_
//numerico, cambia de color el borde del cuadro de texto_x000D_
function verificar(id)_x000D_
{_x000D_
    var obj=document.getElementById(id);_x000D_
    if(obj.value=="")_x000D_
	    value="0";_x000D_
	else_x000D_
	    value=obj.value;_x000D_
    if(validate_importe(value,1))_x000D_
	{_x000D_
	    // marcamos como erroneo_x000D_
		obj.style.borderColor="#808080";_x000D_
		return value;_x000D_
	}else{_x000D_
	    // marcamos como erroneo_x000D_
		obj.style.borderColor="#f00";_x000D_
		return 0;_x000D_
	}_x000D_
}_x000D_
_x000D_
//Funcion para validar el importe_x000D_
//Tiene que recibir: El valor del importe_x000D_
//Determinar si permite o no decimales_x000D_
//Devuelve: true - Correcto , False - Incorrecto_x000D_
function validate_importe(value,decimal)_x000D_
{_x000D_
    if(decimal==undefined)_x000D_
	    decimal=0;_x000D_
	if(decimal==1)_x000D_
	{_x000D_
	    // Permite decimales tanto por . como por ,_x000D_
		var patron=new RegExp("^[0-9]+((,|.)[0-9]{1,2})?$");_x000D_
	}else{_x000D_
		// Numero entero normal_x000D_
		var patron=new RegExp("^([0-9])*$")_x000D_
	}_x000D_
_x000D_
	if(value && value.search(patron)==0)_x000D_
	{_x000D_
		return true;_x000D_
	}_x000D_
	return false;_x000D_
}

_x000D_

.auto-style1 { text-align: center; }_x000D_
		.auto-style2 { background-image: url('http://remesasenvia.com/img/bg_calculo_pesos_blanco.jpg');  }_x000D_
		.auto-style3 { border-width: 0px; }_x000D_
		.auto-style4 { text-align: left; font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style5 { font-size: 55pt; }_x000D_
		.auto-style6 { text-align: left; }_x000D_
		.auto-style7 { text-align: left; font-family: Arial,Helvetica, sans-serif; font-size: 55pt; }_x000D_
		.auto-style8 { font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style9 { font-size: 55pt; font-weight: bold; }_x000D_
		.auto-style10 { text-align: right; }_x000D_
		.auto-style11 { font-size: 55pt; color: #00A743; }

_x000D_

<?php_x000D_
session_start();_x000D_
if(!$_SESSION['user']){_x000D_
	header ("Location: ingresar.php");_x000D_
}_x000D_
?>_x000D_
_x000D_
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">_x000D_
<html xmlns="http://www.w3.org/1999/xhtml">_x000D_
	<head>_x000D_
		<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />_x000D_
		<title>Remesas Envia - Calculo En Pesos</title>_x000D_
		<style type="text/css">_x000D_
		.auto-style1 { text-align: center; }_x000D_
		.auto-style2 { background-image: url('http://remesasenvia.com/img/bg_calculo_pesos_blanco.jpg');  }_x000D_
		.auto-style3 { border-width: 0px; }_x000D_
		.auto-style4 { text-align: left; font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style5 { font-size: 55pt; }_x000D_
		.auto-style6 { text-align: left; }_x000D_
		.auto-style7 { text-align: left; font-family: Arial,Helvetica, sans-serif; font-size: 55pt; }_x000D_
		.auto-style8 { font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style9 { font-size: 55pt; font-weight: bold; }_x000D_
		.auto-style10 { text-align: right; }_x000D_
		.auto-style11 { font-size: 55pt; color: #00A743; }_x000D_
		</style>_x000D_
		<script type="text/javascript"src="/js/calculopesos.js"></script>_x000D_
	</head>_x000D_
_x000D_
<body style="background-color: #E06716; height: 1648px; margin-top: 27px;">_x000D_
_x000D_
<table align="center" cellpadding="0" cellspacing="0" style="width: 940px; height: 1560px" class="auto-style2">_x000D_
		 <tr>_x000D_
		   <td class="auto-style1" style="width: 940px; height: 230px" colspan="2"></td>_x000D_
	     </tr>_x000D_
          <tr>_x000D_
               <td class="auto-style10" style="width: 538px; height: 170px;">_x000D_
			   <input type="number" id="valor1" size="23" style="font-family: Arial; font-size: 85pt; height: 160px; width: 410px;" class="auto-style11" required>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </td>_x000D_
               <td class="auto-style1" style="width: 470px; height: 170px;">_x000D_
			   <img alt height="168" onclick="sumar()" src="http://remesasenvia.com/img/button_calcula.jpg" style="float: left" width="370" class="auto-style11"></td>_x000D_
	     </tr>_x000D_
	      <tr>_x000D_
			<td class="auto-style1" style="width: 940px; height: 1110px;" colspan="2">_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Si envias a Mexico</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
			   <strong>_x000D_
_x000D_
				<input type="text" id="valor2" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">pesos</span></div>_x000D_
_x000D_
		    <p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu familia recibe</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor3" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu envio cuesta</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor4" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu pago total es de</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor5" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
				<br />_x000D_
				<br />_x000D_
				<a name="envio" href="seleccionar_destinatario.php"><img alt height="200" src="http://remesasenvia.com/img/button_continuar.jpg" width="850" class="auto-style3" /></a></td>_x000D_
	    </tr>_x000D_
	     <tr>_x000D_
		   <td class="auto-style1" style="width: 940px; height: 45px" colspan="2"></td>_x000D_
	   </tr>_x000D_
</table>_x000D_
</body>_x000D_
</html>

_x000D_

_x000D_

_x000D_

solución

Puedes ver esta misma pregunta en la versión inglesa aquí.
El siguiente código debería funcionarte: parseFloat(Math.round(num1 * 100) / 100).toFixed(2);.

_x000D_

_x000D_

//funcion que se ejecuta cada vez que se añade una letra en un cuadro de texto_x000D_
//suma los valores de los cuadros de texto_x000D_
_x000D_
function sumar()_x000D_
{_x000D_
		var dolar = 18;_x000D_
		var porcentaje = 100;_x000D_
		var valor1=verificar("valor1");_x000D_
		var valor2=verificar("valor2");_x000D_
		var valor3=verificar("valor3");_x000D_
		var valor4=verificar("valor4");_x000D_
		var valor5=verificar("valor5");_x000D_
		x = parseFloat(valor1);_x000D_
		y = parseFloat(valor1)/parseFloat(dolar);_x000D_
		z = parseFloat(valor1)/porcentaje*10/parseFloat(dolar);_x000D_
		f = parseFloat(y)+parseFloat(z);_x000D_
_x000D_
        // Bloque para dar formato a los campos._x000D_
        x = parseFloat(Math.round(x * 100) / 100).toFixed(2);_x000D_
        y = parseFloat(Math.round(y * 100) / 100).toFixed(2);_x000D_
        z = parseFloat(Math.round(z * 100) / 100).toFixed(2);_x000D_
        f = parseFloat(Math.round(f * 100) / 100).toFixed(2);_x000D_
_x000D_
		// realizamos la suma de los valores y los ponemos en la casilla del_x000D_
		// formulario que contiene el total_x000D_
_x000D_
		document.getElementById("valor2").value= x;_x000D_
_x000D_
    	document.getElementById("valor3").value= y;_x000D_
_x000D_
		document.getElementById("valor4").value= z;_x000D_
		_x000D_
    	document.getElementById("valor5").value= f;_x000D_
_x000D_
}_x000D_
_x000D_
//funcion para verificar los valores de los cuadros de texto. si no es un valor_x000D_
//numerico, cambia de color el borde del cuadro de texto_x000D_
_x000D_
function verificar(id)_x000D_
{_x000D_
		var obj=document.getElementById(id);_x000D_
		if(obj.value=="")_x000D_
				value="0";_x000D_
		else_x000D_
				value=obj.value;_x000D_
		if(validate_importe(value,1))_x000D_
		{_x000D_
				// marcamos como erroneo_x000D_
				obj.style.borderColor="#808080";_x000D_
				return value;_x000D_
		}else{_x000D_
				// marcamos como erroneo_x000D_
				obj.style.borderColor="#f00";_x000D_
				return 0;_x000D_
		}_x000D_
}_x000D_
_x000D_
//Funcion para validar el importe_x000D_
//Tiene que recibir: El valor del importe_x000D_
//Determinar si permite o no decimales_x000D_
//Devuelve: true - Correcto , False - Incorrecto_x000D_
_x000D_
function validate_importe(value,decimal)_x000D_
{_x000D_
		if(decimal==undefined)_x000D_
				decimal=0;_x000D_
_x000D_
		if(decimal==1)_x000D_
		{_x000D_
				// Permite decimales tanto por . como por ,_x000D_
				var patron=new RegExp("^[0-9]+((,|.)[0-9]{1,2})?$");_x000D_
		}else{_x000D_
				// Numero entero normal_x000D_
				var patron=new RegExp("^([0-9])*$")_x000D_
		}_x000D_
_x000D_
		if(value && value.search(patron)==0)_x000D_
		{_x000D_
				return true;_x000D_
		}_x000D_
		return false;_x000D_
}

_x000D_

.auto-style1 { text-align: center; }_x000D_
		.auto-style2 { background-image: url('http://remesasenvia.com/img/bg_calculo_pesos_blanco.jpg');  }_x000D_
		.auto-style3 { border-width: 0px; }_x000D_
		.auto-style4 { text-align: left; font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style5 { font-size: 55pt; }_x000D_
		.auto-style6 { text-align: left; }_x000D_
		.auto-style7 { text-align: left; font-family: Arial,Helvetica, sans-serif; font-size: 55pt; }_x000D_
		.auto-style8 { font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style9 { font-size: 55pt; font-weight: bold; }_x000D_
		.auto-style10 { text-align: right; }_x000D_
		.auto-style11 { font-size: 55pt; color: #00A743; }

_x000D_

<?php_x000D_
session_start();_x000D_
if(!$_SESSION['user']){_x000D_
	header ("Location: ingresar.php");_x000D_
}_x000D_
?>_x000D_
_x000D_
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">_x000D_
<html xmlns="http://www.w3.org/1999/xhtml">_x000D_
	<head>_x000D_
		<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />_x000D_
		<title>Remesas Envia - Calculo En Pesos</title>_x000D_
		<style type="text/css">_x000D_
		.auto-style1 { text-align: center; }_x000D_
		.auto-style2 { background-image: url('http://remesasenvia.com/img/bg_calculo_pesos_blanco.jpg');  }_x000D_
		.auto-style3 { border-width: 0px; }_x000D_
		.auto-style4 { text-align: left; font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style5 { font-size: 55pt; }_x000D_
		.auto-style6 { text-align: left; }_x000D_
		.auto-style7 { text-align: left; font-family: Arial,Helvetica, sans-serif; font-size: 55pt; }_x000D_
		.auto-style8 { font-family: Arial, Helvetica, sans-serif; }_x000D_
		.auto-style9 { font-size: 55pt; font-weight: bold; }_x000D_
		.auto-style10 { text-align: right; }_x000D_
		.auto-style11 { font-size: 55pt; color: #00A743; }_x000D_
		</style>_x000D_
		<script type="text/javascript"src="/js/calculopesos.js"></script>_x000D_
	</head>_x000D_
_x000D_
<body style="background-color: #E06716; height: 1648px; margin-top: 27px;">_x000D_
_x000D_
<table align="center" cellpadding="0" cellspacing="0" style="width: 940px; height: 1560px" class="auto-style2">_x000D_
		 <tr>_x000D_
		   <td class="auto-style1" style="width: 940px; height: 230px" colspan="2"></td>_x000D_
	     </tr>_x000D_
          <tr>_x000D_
               <td class="auto-style10" style="width: 538px; height: 170px;">_x000D_
			   <input type="number" id="valor1" size="23" style="font-family: Arial; font-size: 85pt; height: 160px; width: 410px;" class="auto-style11" required>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </td>_x000D_
               <td class="auto-style1" style="width: 470px; height: 170px;">_x000D_
			   <img alt height="168" onclick="sumar()" src="http://remesasenvia.com/img/button_calcula.jpg" style="float: left" width="370" class="auto-style11"></td>_x000D_
	     </tr>_x000D_
	      <tr>_x000D_
			<td class="auto-style1" style="width: 940px; height: 1110px;" colspan="2">_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Si envias a Mexico</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
			   <strong>_x000D_
_x000D_
				<input type="text" id="valor2" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">pesos</span></div>_x000D_
_x000D_
		    <p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu familia recibe</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor3" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu envio cuesta</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor4" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
_x000D_
			<p class="auto-style4"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tu pago total es de</span></p>_x000D_
		    <div class="auto-style6"><span class="auto-style5">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="auto-style8"><strong>$</strong></span></span>_x000D_
_x000D_
				<strong>_x000D_
_x000D_
				<input type="text" id="valor5" value="0.00" disabled value="0" size="23" style="font-family: Arial; font-size: 55pt; height: 75px; width: 335px;" required class="auto-style9"></strong>_x000D_
				<span class="auto-style7">dolares</span></div>_x000D_
				<br />_x000D_
				<br />_x000D_
				<a name="envio" href="seleccionar_destinatario.php"><img alt height="200" src="http://remesasenvia.com/img/button_continuar.jpg" width="850" class="auto-style3" /></a></td>_x000D_
	    </tr>_x000D_
	     <tr>_x000D_
		   <td class="auto-style1" style="width: 940px; height: 45px" colspan="2"></td>_x000D_
	   </tr>_x000D_
</table>_x000D_
</body>_x000D_
</html>

_x000D_

_x000D_

_x000D_

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *