• Categoría de la entrada:JQuery

En alguna ocasión puede que necesitemos habilitar o deshabilitar elementos de entrada de un formulario como <input><select><textarea>, etc. Bueno podemos hacerlo dinámicamente con JQuery estableciendo la propiedad disabled de un elemento en true y habilitarlo nuevamente configurando disabled en false .

Puede cambiar esta propiedad utilizando la función prop() o attr() , dependiendo de la versión de jQuery que esté utilizando.

// Deshabilitar #x
$( "#x" ).prop( "disabled", true );
 
// Habilitar #x
$( "#x" ).prop( "disabled", false );

La función prop() se agregó en jQuery 1.6 y es la forma estándar de manejar las propiedades, pero la función attr() hace el mismo trabajo para jQuery 1.5 y versiones inferiores, por lo que puede usar attr() para el mismo propósito en versiones jQuery inferiores a 1.6.

Ejemplo como habilitar o deshabilitar input con Jquery

<h2>Habilitar y deshabilitar input usando JQuery</h2> 

<form id="formulario-input-ejemplo"> 

Ingresa tu nombre: <input type="text" id="nombre"> 

</form> 

<button id="btnDeshabilitar" >Deshabilitar input</button> 
<button id="btnHabilitar" >Habilitar input</button> 

<script src="https://code.jquery.com/jquery-1.6.2.min.js"></script> 
<script> 

$(document).ready(function() { 
	
	$("#btnHabilitar").click(function(){ 
		$("#nombre").prop("disabled", false); 
		}); 
		
	$("#btnDeshabilitar").click(function(){ 
		$("#nombre").prop("disabled", true); 
		}); 
}); 

</script> 

Deja una respuesta