Tengo una página html que tiene campos de entrada para que el usuario ingrese la cantidad de frutas. Al presionar la tecla / presionar la tecla hacia arriba, se supone que debe llamar al método del archivo javascript y verificar si es un dígito. Si no es un dígito, el campo del cuadro de texto se borrará. Sin embargo, mi cuadro de texto no se borra cuando intento ingresar un valor no numérico. ¿Falta algo en mi código?

Html

                    <div class="form-group ">
                        <label class="control-label " for="name"> Name </label>
                        <input class="form-control" id="name" name="name" type="text" /> <span class="help-block" id="hint_name"> Enter your name </span>
                    </div>
                    <div class="form-group ">
                        <label class="control-label" for="apple"> Apple ( 69cents ) </label>
                        <input class="form-control form-control-input" id="apple" name="apple" type="text" autocomplete="off" onkeyup="isNumber(this,event)" /> <span class="help-block" id="hint_number"> Enter Qty </span>
                    </div>
                    <div class="form-group ">
                        <label class="control-label" for="orange"> Orange ( 59cents ) </label>
                        <input class="form-control form-control-input" id="orange" name="orange" type="text" autocomplete="off" onkeyup="isNumber(this,event)" /> <span class="help-block" id="hint_number1"> Enter Qty </span>
                    </div>
                    <div class="form-group ">
                        <label class="control-label" for="banana"> Banana ( 39cents ) </label>
                        <input class="form-control form-control-input" id="banana" name="banana" type="text" autocomplete="off" onkeyup="isNumber(this,event)" /> <span class="help-block" id="hint_number2"> Enter Qty </span>
                    </div>

Javascript

 function isNumber(idValue, evt) {
    evt = (evt) ? evt : window.event;
    var sum = 0;
    var costOfApple = 0;
    var costOfOrange = 0;
    var costOfBanana = 0;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        document.getElementById('idValue.id').value = "";
        document.getElementById('totalCost').value = "NaN";
        $("#invalid-alert").fadeTo(2000, 500).slideUp(500, function() {
            $("#invalid-alert").slideUp(500);
        });
    } else {
        costOfApple = document.getElementById('apple').value * 69;
        costOfOrange = document.getElementById('orange').value * 59;
        costOfBanana = document.getElementById('banana').value * 39;
        sum = (Number(costOfApple) + Number(costOfOrange) + Number(costOfBanana)) / 100;
        document.getElementById('totalCost').value = "$" + (sum).toFixed(2);
    }
}
0
Derrick Peh 30 oct. 2017 a las 09:56

4 respuestas

La mejor respuesta

La declaración del problema es

document.getElementById('idValue.id').value = "";

Está pasando la cadena 'idValue.id' a la función y el elemento con ID no existe, por lo tanto, el código no funciona y debe obtener un error en la consola del navegador.

Como idValue se refiere al elemento que invoca el controlador de eventos. Puede usarlo directamente para establecer su propiedad.

idValue.value = ""
2
Satpal 30 oct. 2017 a las 06:59

Yo pienso

document.getElementById('idValue.id').value = "";

Debe ser

document.getElementById(idValue.id).value = "";

O

idValue.value = "";

Y, ¡es bueno console.dir( idValue ) en la función isNumber!

Prueba por favor!

2
Byeongin Yoon 30 oct. 2017 a las 07:02

Está pasando esto a una función, y esta es aquí la entrada que debe usar como un objeto, no como una cadena.

No hagas eso:

 document.getElementById('idValue.id').value = "";

Intente esto en su lugar

document.getElementById(idValue.id).value = "";
1
Codifier 30 oct. 2017 a las 08:20
$(document).on('change', 'input', function() {
    if($('#Id').val() == "" ) { 
       // Do something
    }
});

O

    document.getElementById(yourID).value = "";
0
Myco Claro 30 oct. 2017 a las 07:03