0

Estoy intentando hacer un código al que se le ingresan datos de altura y frecuencia; en caso de que alguno de esos datos estén por fuera de los parámetros debe mostrar un alerta indicando que ese dato debe ser cambiado.

En el caso de la primera (altura) funciona bien la alerta, pero en el caso de la altura 2 y la frecuencia no sale ninguna alerta.

Quisiera saber cual es mi error.

    <!DOCTYPE html>
    <html>
    
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>ttt</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <div class="cell-md-4">
    <div class="row">
    <div class="cell">
    <div class="card">
    <div class="card-header clear">Altura</div>
    <div class="card-content p-3">
    <input id="htx" value="35" type="text" data-role="materialinput" data-label="Altura" placeholder="Ingrese la altura" onchange="updateLoss();">
    </div>
    </div>
    </div>
    </div>
    <div class="row">
    <div class="cell">
    <div class="card">
    <div class="card-header clear">Alrtura 2</div>
    <div class="card-content p-3">
    <input id="hrx" value="1.5" type="text" data-role="materialinput" data-label="Altura" placeholder="Ingrese la altura" onchange="updateLoss();">
    </div>
    </div>
    </div>
    </div>
    <div class="row">
    <div class="cell">
    <div class="card">
    <div class="card-header"> Frecuencia </div>
    <div class="card-content p-3">
    <input id="frecuencia" value="150000000" type="text" data-role="materialinput" data-label="Frecuencia [Hz]" placeholder="Ingrese la frecuencia" onchange="updateLoss();">
    </div>
    </div>
    </div>
    
    <body>
      <script>
    function updateLoss (hr){
    var hr = parseFloat(document.getElementById("hrx").value);
    if(hr < 1 || hr > 10){window.alert("no valido altura " + hr + "m");
    }
    }            
                 
    function updateLoss(freq){
    var freq = parseFloat(document.getElementById("frecuencia").value);
    if(freq < 150000000 ||freq > 1500000000){window.alert("no valido para la frecuencia " + freq + "Hz"); }
    }
                             
    function updateLoss(ht){
    var ht = parseFloat(document.getElementById("htx").value);
     if(ht < 30 || ht > 200){window.alert("no valido para la altura " + ht + "m");}
    } 
      
    </script>
    </body>
    
    </html>

3
  • 1
    Tienes 3 funciones con el mismo nombre y el navegador va a ejecutar siempre la misma, por eso solo funcionará una.
    – Triby
    Commented el 15 oct. 2020 a las 15:50
  • Hola, si era eso muchas gracias. Ya hice la corrección Commented el 15 oct. 2020 a las 16:11
  • Escribe tu respuesta y aceptala para poder cerrar la pregunta.
    – Candid Moe
    Commented el 16 oct. 2020 a las 11:23

1 respuesta 1

0

que te parece usar solo 1 función y pasar como parámetro para que lo utilizaras así evitas duplicidad de funciones.

Solo acomode tu código para esto.

function updateLoss(tipo) {
  if (tipo == 'altura2') {
    var hr = parseFloat(document.getElementById("hrx").value);
    if (hr < 1 || hr > 10) {
      window.alert("no valido altura " + hr + "m");
    }
  }
  if (tipo == 'frecuencia') {
    var freq = parseFloat(document.getElementById("frecuencia").value);
    if (freq < 150000000 || freq > 1500000000) {
      window.alert("no valido para la frecuencia " + freq + "Hz");
    }
  }

  if (tipo == 'altura') {
    var ht = parseFloat(document.getElementById("htx").value);
    if (ht < 30 || ht > 200) {
      window.alert("no valido para la altura " + ht + "m");
    }
  }

}
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>ttt</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
  <div class="cell-md-4">
    <div class="row">
      <div class="cell">
        <div class="card">
          <div class="card-header clear">Altura</div>
          <div class="card-content p-3">
            <input id="htx" value="35" type="text" data-role="materialinput" data-label="Altura" placeholder="Ingrese la altura" onkeyup="updateLoss('altura');">
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="cell">
        <div class="card">
          <div class="card-header clear">Alrtura 2</div>
          <div class="card-content p-3">
            <input id="hrx" value="1.5" type="text" data-role="materialinput" data-label="Altura" placeholder="Ingrese la altura" onkeyup="updateLoss('altura2');">
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="cell">
        <div class="card">
          <div class="card-header"> Frecuencia </div>
          <div class="card-content p-3">
            <input id="frecuencia" value="150000000" type="text" data-role="materialinput" data-label="Frecuencia [Hz]" placeholder="Ingrese la frecuencia" onkeyup="updateLoss('frecuencia');">
          </div>
        </div>
      </div>

      <body>
      </body>

</html>

1

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.