2009-03-10 14 views
8

Tengo en el cuadro de entrada que solo puede contener valores numéricos (con el uso del complemento this).
Ahora quiero que la entrada esté debajo, digamos 90. Si se ingresa un valor que excede este tope máximo o no se puede analizar, se debe insertar el valor anterior. De forma predeterminada, el cuadro contendrá "1".Mantener el valor en el cuadro de entrada html debajo de la cantidad establecida

<input id="targetQuantity" name="targetQuantity" type="text" value="1" /> 

Imagino que debería captar el valor actual de alguna manera. Intenta analizar el nuevo valor. Si se trata de un valor permitido, continúe con este valor, de lo contrario, devuelva el anterior.
Como mis habilidades JS son realmente limitadas, ni siquiera sé qué eventos están disponibles para mí y la documentación que encontré en el intarwebz me resulta bastante confusa.

--EDIT--
Terminé usando Sergei's código y usando Aaron's consejos usabilidad.
Todo lo que busco ahora es activar/desactivar el envío de un formulario completo. Simplemente deshabilitar un botón de enviar no es suficiente.

+0

Por qué hacer esto con javascript? ¿Por qué no simplemente agregar maxlength = "90" a los atributos del elemento de entrada? – robertc

+1

porque maxlength permite 90 caracteres. él quiere maxvalue, si existiera ... – Spikolynn

+0

Duh! Debería haber leído eso con más cuidado ... – robertc

Respuesta

6
<input id="targetQuantity" name="targetQuantity" type="text" value="1" onkeyup="check(this)" /> 

... JavaScript:

var v=1; 

function check(i) {  
    if(i.value > 100) { 
    i.value=v; 
    alert("< 100"); 
    } 
    else 
    v=i.value; 
} 
2

Esto debería ayudar: JavaScript Madness: Keyboard Events

Ahora una palabra en la usabilidad: Nunca cambia el valor que el usuario escribe. Si quieres saber por qué, pruébalo.

En su lugar, active el campo en rojo (establezca el color de fondo). Cuando se envíe el formulario, vuelva a ejecutar la validación para asegurarse de que el usuario haya corregido el error. De lo contrario, muestre un mensaje de error en línea ("el valor debe ser < 90") en algún lugar cerca del campo y establezca el foco en el campo.

No utilizar alerta(). alert() es solo para la depuración y no tiene uso en una aplicación web real ya que a) interrumpe el flujo de trabajo del usuario yb) no funciona cuando el usuario está escribiendo: Eventualmente, el usuario presionará el espacio y el diálogo se cerrará, posiblemente con el usuario siempre notando que hubo un diálogo o lo que dijo.

Es posible que desee consultar una biblioteca como jQuery o Prototype porque ya contienen todos los componentes básicos que necesita y solucionan muchos errores del navegador para usted.

+0

Gracias por el consejo. No uso alertas a excepción de la depuración. De hecho, son la razón por la que navego sin script en Opera la mayor parte del tiempo. Además, ya estoy usando JQuery. –

1

escribir este js en un bloque de código javascript:

var LastGood = 1; 
function CheckValue(input, max) { 
    var value = Number(input.value); 
    if (NaN == value || input.value>max) { //it is not a number or is too big - revert 
     input.value = LastGood; 
    } else { //it is ok, save it as the last good value 
     LastGood = value; 
    } 
} 

cambio de su formulario de entrada a

<input id="targetQuantity" name="targetQuantity" type="text" value="1" onkeyup="CheckValue(this, 90)" /> 
Cuestiones relacionadas