Een HTML-invoerknop uitschakelen en inschakelen

Dus ik heb een knop zoals deze:

<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>

Hoe kan ik het uitschakelen en inschakelen als ik wil? Ik heb het disabled="disable", maar het inschakelen is een probleem. Ik probeerde het terug te brengen naar False, maar dat ging het niet in.


Antwoord 1, Autoriteit 100%

JavaScript gebruiken

  • Een HTML-knop uitschakelen

    document.getElementById("Button").disabled = true;
    
  • Een HTML-knop inschakelen

    document.getElementById("Button").disabled = false;
    
  • demo hier


met jQuery

Alle versies van jQuery vóór 1,6

  • Een HTML-knop uitschakelen

    $('#Button').attr('disabled','disabled');
    
  • Een HTML-knop inschakelen

    $('#Button').removeAttr('disabled');
    
  • Demo hier

Alle versies van jQuery na 1,6

  • Een HTML-knop uitschakelen

    $('#Button').prop('disabled', true);
    
  • Een HTML-knop inschakelen

    $('#Button').prop('disabled', false);
    
  • Demo hier

P.S. De code bijgewerkt op basis van jQuery 1.6.1-wijzigingen. Gebruik als suggestie altijd de nieuwste jQuery-bestanden en de prop()-methode.


Antwoord 2, autoriteit 5%

Aangezien u het in de eerste plaats uitschakelt, kunt u het inschakelen door de eigenschap disabledin te stellen op false.

Om de eigenschap disabledin Javascript te wijzigen, gebruikt u dit:

var btn = document.getElementById("Button");
btn.disabled = false;

En om het natuurlijk weer uit te schakelen, zou je in plaats daarvan truegebruiken.

Omdat je de vraag ook met jQuery hebt getagd, kun je de methode .propgebruiken. Iets als:

var btn = $("#Button");
btn.prop("disabled", true);   // Or `false`

Dit is in de nieuwere versies van jQuery. De oudere manier om dit te doen is door een attribuut toe te voegen of te verwijderen, zoals:

var btn = $("#Button");
btn.attr("disabled", "disabled");
// or
btn.removeAttr("disabled");

De loutere aanwezigheid van de eigenschap disabledschakelt het element uit, dus u kunt de waarde niet instellen op “false”. Zelfs het volgende zou het element moeten uitschakelen

<input type="button" value="Submit" disabled="" />

U moet het kenmerk volledig verwijderen ofde eigenschap ervan instellen.


Antwoord 3, autoriteit 2%

Je kunt dit vrij eenvoudig doen met gewoon JavaScript, geen bibliotheken vereist.

Een knop inschakelen

document.getElementById("Button").disabled=false;

Een knop uitschakelen

document.getElementById("Button").disabled=true;

Geen externe bibliotheken nodig.


Antwoord 4

het kenmerk uitschakelen heeft slechts één parameter. als je het opnieuw wilt inschakelen, moet je het hele ding verwijderen, niet alleen de waarde wijzigen.


Antwoord 5

$(".btncancel").button({ disabled: true });

Hier is ‘btncancel’ de klassenaam van de knop.


Antwoord 6

Zonder jQuery zal de invoer eenvoudiger zijn

Button.disabled=1;

Antwoord 7

<!--Button Disable Script-->
    <script type="text/javascript">
        function DisableButton() {
            document.getElementById("<%=btnSave.ClientID %>").disabled = true;
        }
        window.onbeforeunload = DisableButton;
    </script>
    <!--Button Disable Script-->

Antwoord 8

Hoewel niet direct gerelateerd aan de vraag, als je op deze vraag springt en iets anders wilt uitschakelen dan de typische invoerelementen button, input, textarea, zal de syntaxis niet werken.

>

Gebruik een div of een spanwijdte uit, gebruik setattribute

document.querySelector('#somedivorspan').setAttribute('disabled', true);

P.S: Gotcha, noem dit alleen als u van plan bent om uit te schakelen. Een bug in Chrome-versie 83 zorgt ervoor dat dit altijd uitschakelt, zelfs wanneer de tweede parameter onwaar is.


Antwoord 9

Een HTML-invoerknop uitschakelen / inschakelen met JavaScript:

(en reageer met refs. Vervang “Elementref.current” met elementelectie als deze niet reageert)

elementRef.current.setAttribute('disabled', 'disabled');

Inschakelen:

elementRef.current.removeAttribute('disabled');

Antwoord 10

Dit zal zeker werken.

om een ​​knop

uit te schakelen

$('#btn_id').button('disable');

om een ​​knop

in te schakelen

$('#btn_id').button('enable');

Antwoord 11

Stick to php …

Waarom niet alleen toestaan ​​dat de knop verschijnt zodra er een bovenstaande criteria is voldaan.

<?
if (whatever == something) {
    $display = '<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>';
    return $display;
}
?>

Other episodes