2012-09-15 15 views
5

Duplicar posibles:
Check if inputs are empty using jQueryCómo comprobar si el cualquiera de mi cuadro de texto está vacío o no en javascript

tengo forma y cuadros de texto, ¿cómo voy a determinar si alguna de estas textboxes está vacío usando javascript if else statement una vez que se hace clic en un botón de formulario.

function checking() { 
    var textBox = $('input:text').value; 
    if (textBox == "") { 
     $("#error").show('slow'); 
    } 
} 

¡Gracias de antemano!

+0

http://stackoverflow.com/questions/1854556/check-if-inputs-are-empty-using-jquery – jeremy

Respuesta

12

Mediante el uso de selectores de jQuery para la selección de los elementos, que tienen un objeto jQuery y se debe utilizar val() método para obtener/establecer el valor de los elementos de entrada.

También tenga en cuenta que :text selector es obsoleto y sería mejor recortar el texto para eliminar los espacios en blanco de caracteres. puede usar la función de utilidad $.trim.

function checking() { 
    var textBox = $.trim($('input[type=text]').val()) 
    if (textBox == "") { 
     $("#error").show('slow'); 
    } 
} 

Si desea utilizar value propiedad que debe convertir primero el objeto jQuery en un objeto DOM prima. Puede usar el método [index] o get.

var textBox = $('input[type=text]')[0].value; 

Si tiene múltiples entradas, debe recorrerlas.

function checking() { 
    var empty = 0; 
    $('input[type=text]').each(function(){ 
     if (this.value == "") { 
      empty++; 
      $("#error").show('slow'); 
     } 
    }) 
    alert(empty + ' empty input(s)') 
} 
+0

¡Hola! Esto tampoco funcionó. Tengo 6 cuadros de texto y dos de estos cuadros de texto tienen valores, ¿afecta la condición? Lo que trato de hacer es que una vez que el usuario haga clic en el botón de enviar y que cualquiera de los cuadros de texto restantes esté vacío, se mostrará la advertencia de error. Gracias. – ray

+0

@ray Hola, prueba el código actualizado. – undefined

+0

¡Hola! No es bueno, creo que no tengo que hacer bucles. En realidad tengo mucho solución - la comprobación> 'función() { \t \t \t si (. Document.getElementById ("entry_0") valor == "") \t \t { \t \t \t $ (" # error "). show ('lento'); \t \t} \t \t \t \t si (document.getElementById ("entry_1") == valor "") \t \t { \t \t \t $ ("# error") espectáculo ('lento').; \t \t}} ' \t Imagínese, si tengo 20 cuadros de texto. Es por eso que trato de llamar a la entrada: el objeto de texto en sí o la 'entrada de formulario' para llamar a todos los cuadros de texto en una sola función. ¡Gracias! – ray

5

No se puede usar value con la función de uso de objeto jquery val(), pero esto solo marcará el primer cuadro de texto devuelto por el selector.

Live Demo

function checking() {  
    var textBox = $('input:text').val(); 
    if (textBox == "") { 
     $("#error").show('slow'); 
    } 
} 

Puede adjuntar blur evento y hacer esta validación en losing focus from each textbox.

Live Demo

$('input:text').blur(function() {  
    var textBox = $('input:text').val(); 
    if (textBox == "") { 
     $("#error").show('slow'); 
    } 
}); 

validación en submit button clic Accordi ng a discusión con OP

Live Demo

$('#btnSubmit').click(function() { 
    $("#error").hide();  
    $('input:text').each(function(){ 
     if($(this).val().length == 0) 
      $("#error").show('slow'); 
    }); 
}); 
+0

Gracias por su respuesta inmediata, en realidad he tratado tan bien, pero no es bueno. Tengo 6 cuadros de texto y dos de estos cuadros de texto tienen valores, ¿afecta la condición? Lo que trato de hacer es que una vez que el usuario haga clic en el botón de enviar y que cualquiera de los cuadros de texto restantes esté vacío, se mostrará la advertencia de error. – ray

+0

Actualiza mi respuesta, espero que te ayude a hacer lo que quieras. – Adil

+1

@Adil Esta es una respuesta excelente y muy informativa. +1. – tgriffiths

1

Prueba este código:

var textBox = $('input:text').val(); 

if (textBox==""){ 
    $("#error").show('slow'); 
} 
Cuestiones relacionadas