¿Cómo puedo deshabilitar el campo de texto HTML usando esta simple jQuery?

Tengo este código jQuery simple para probar.¿Cómo puedo deshabilitar el campo de texto HTML usando esta simple jQuery?

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
      $("text").attr("disabled",""); 
     }); 
    }); 
</script> 
</head> 
<body> 
<input type="text"> 
<br /> 
<button>Set the textfield disabled</button> 
</body> 
</html>

Básicamente, la página HTML viene con un simple botón y campo de texto. Todo lo que quiero es que el campo de entrada esté desactivado al hacer clic en el botón. Pero no funciona?

(PS: este código se obtiene a partir de w3schools.com sitio web, sólo para probar simplemente fuera de lo poderoso jQuery es).

Fuente

2012-01-27 awongCM

Eso explica por qué W3School no es apreciado aquí. el HTML no es válido mira ese elemento de texto ... – gdoron

@gdoron: ¿Qué pasa con el elemento ''? No está cerrado correctamente? ¿No es eso válido en HTML5? '' los elementos nunca tienen contenido, por lo que no es ambiguo. – mpen

@Mark. Mira mi respuesta. Debería ser con cierre automático '' como cada elemento XML. – gdoron

De jQuery 1.7, se puede utilizar .prop:

$(document).ready(function(){ 
    $("button").click(function(){ 
     $(":text").prop("disabled", true); 
    }); 
});

Antes de 1,7, se puede hacer:

$(document).ready(function(){ 
    $("button").click(function(){ 
     $(":text").attr("disabled", true); 
    }); 
});

PS: Uso $(":text")$('input[type="text"]') o para seleccionar todos los elementos de tipo texto.

Fuente

2012-01-27 07:20:56 xdazz

$ ('text') no es un selector válido. – devnull69

.attr también funciona en jQuery 1.7+. – gabitzish

@ devnull69 Sí, tienes razón, no te diste cuenta. – xdazz

$ ("input") attr ("desactivado", "desactivado");

Fuente

2012-01-27 07:20:25 gabitzish

Eso deshabilitará los botones y las otras entradas que tenga en la página también ... – gdoron

-1

"disabled" es una propiedad, no un atributo per se. Los booleanos como "marcado" o "desactivado" no siempre se actualizan (o recuperan) correctamente al acceder de esa manera. Utilice

$(':text').prop('disabled',true);

en su lugar.

Fuente

2012-01-27 07:20:59 mpen

$ ('text') no es un selector válido! – devnull69

@ devnull69: Mi mal. Pensé que había algo fuera de lugar. ': text' es sin embargo. Actualizado. Supongo que pensé que habría verificado si el selector combinaba elementos. – mpen

O (más moderno):

$("input[type=text]").prop('disabled', true);

Fuente

2012-01-27 07:22:21 devnull69

Prueba esto:

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){  
$("button").click(function(){   
$("#text").attr("disabled","true");  
}); 
}); 
</script> 
</head> 
<body> 
<input id="text" type="text"> 
<br /> 
<button>Set the textfield disabled</button> 
</body> 
</html>

Fuente

2012-01-27 07:24:41

@ devnull69- Lo he comprobado y funciona bien! –

@gdoron Tapas también cambió el HTML debajo de – devnull69

@ devnull69. Pero lo escondí con una mala sangría ... =) – gdoron

No hay text selectora en jquery. Es necesario utilizar el selector de atributos [attribute=value]

$('input[type=text]').prop('disabled', true); // prop Works on jquery 1.7+

$('input[type=text]').attr('disabled', 'disabled'); // Works in each version. 
                // But isn't W3C standard.

hay un selector de :text pero es menos eficiente entonces la primera opción, consulte la docs:

$ (': texto') es equivalente a $ ('[type = text]') y así seleccionar s todos los elementos. Al igual que con otros selectores de pseudo-clase (aquellos que comienzan con un ":"), se recomienda precederlo con un nombre de etiqueta o algún otro selector; de lo contrario, el selector universal ("") está implícito. En otras palabras, el bare $ (': text') es equivalente a $ (': text'), por lo que debe usarse $ ('input: text') en su lugar.

Notas adicionales: Debido a : Texto es una extensión de jQuery y no forma parte de la especificación CSS , consultas usando: texto no puede tomar ventaja de el aumento de rendimiento proporcionado por el método nativo DOM querySelectorAll() . Para un mejor rendimiento en los navegadores modernos, utilice [type = "text"] en su lugar.

Tenga en cuenta que su XHTML no es válido. Debe cerrar el <input type="text"> =><input type="text" />

Fuente

2012-01-27 07:27:23 gdoron

Sí. Esa es probablemente la razón. – awongCM

@ AW-GWTF899. Entonces debes aceptar la respuesta ... ** =) ** – gdoron

¿Cómo puedo deshabilitar el campo de texto HTML usando esta simple jQuery?

Respuesta

Cuestiones relacionadas