Desactivar e activar um botão de entrada em html
<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>
Como posso desativá-lo e ativá-lo quando quero? Já tentei, mas permitir a volta é um problema. Tentei configurá-lo como falso, mas isso não o permitiu.
7 answers
Usando Javascript
-
Desactivar um botão html
document.getElementById("Button").disabled = true;
-
Activar um botão html
document.getElementById("Button").disabled = false;
Demonstração Aqui
Usando jQuery
Todas as versões de jQuery antes de 1.6
-
Desactivar um botão html
$('#Button').attr('disabled','disabled');
-
Activar um botão html
$('#Button').removeAttr('disabled');
Demonstração Toma.
Todas as versões de jQuery depois 1.6
-
Desactivar um botão html
$('#Button').prop('disabled', true);
-
Activar um botão html
$('#Button').prop('disabled', false);
Demonstração Aqui
P. S.: actualizou o código com base em jQuery 1.6.1 alterações. Como sugestão, use sempre os últimos arquivos jquery e o método prop()
.
Uma vez que está a desactivá-la em primeiro lugar, a maneira de a activar é definir a sua propriedade disabled
como false
.
Para alterar a sua propriedade disabled
em Javascript, use isto:
var btn = document.getElementById("Button");
btn.disabled = false;
E obviamente para desativá-lo novamente, você usaria true
em vez disso.
Já que também marcaste a pergunta com jQuery, podias usar o método .prop
. Algo do género:
var btn = $("#Button");
btn.prop("disabled", true); // Or `false`
Isto está nas versões mais recentes do jQuery. A forma mais antiga de o fazer é adicionar ou remover um atributo como assim:
var btn = $("#Button");
btn.attr("disabled", "disabled");
// or
btn.removeAttr("disabled");
A mera presença da propriedade disabled
desactiva o elemento, por isso não se pode definir o seu valor como "falso". Mesmo o seguinte deve desactivar o elemento
<input type="button" value="Submit" disabled="" />
É necessário remover completamente o atributo ou definir a sua propriedade.
Você pode fazer isso facilmente com apenas JavaScript direto, sem necessidade de bibliotecas.
Activar um botão
document.getElementById("Button").disabled=false;
Desactivar um botão
document.getElementById("Button").disabled=true;
Não são necessárias bibliotecas externas.
O atributo disable só tem um parâmetro. se você quiser reenable-lo você tem que remover a coisa toda, não apenas mudar o valor.
$(".btncancel").button({ disabled: true });
Aqui 'btncancel' é o nome da classe do botão.
Para desactivar um botão
$('#btn_id').button('disable');
Para activar um botão
$('#btn_id').button('enable');
Por que não permitir apenas que o botão apareça quando os critérios acima forem cumpridos.
<?
if (whatever == something) {
$display = '<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>';
return $display;
}
?>