Vraag Inschakelen / inschakelen van een invoer met jQuery?


$input.disabled = true;

of

$input.disabled = "disabled";

Welke is de standaardmanier? En, omgekeerd, hoe schakel je een uitgeschakelde invoer in?


1910
2017-09-12 05:21


oorsprong


antwoorden:


jQuery 1.6+

Om de disabled eigenschap die u moet gebruiken .prop() functie.

$("input").prop('disabled', true);
$("input").prop('disabled', false);

jQuery 1.5 en lager

De .prop() functie bestaat niet, maar .attr() doet hetzelfde:

Stel het uitgeschakeld attribuut in.

$("input").attr('disabled','disabled');

Om opnieuw in te schakelen, is de juiste methode om te gebruiken .removeAttr()

$("input").removeAttr('disabled');

In elke versie van jQuery

Je kunt altijd vertrouwen op het eigenlijke DOM-object en het is waarschijnlijk iets sneller dan de andere twee opties als je maar met één element te maken hebt:

// assuming an event handler thus 'this'
this.disabled = true;

Het voordeel van het gebruik van de .prop() of .attr() methoden is dat u de eigenschap voor een aantal geselecteerde items kunt instellen.


Notitie: In 1.6 is er een .removeProp() methode die veel lijkt op removeAttr(), maar het MAG NIET WORDEN GEBRUIKT op native eigenschappen zoals 'disabled'  Fragment uit de documentatie:

Opmerking: Gebruik deze methode niet om native eigenschappen zoals gecontroleerd, uitgeschakeld of geselecteerd te verwijderen. Hiermee wordt de eigenschap volledig verwijderd en kan deze na verwijdering niet meer aan het element worden toegevoegd. Gebruik .prop () om deze eigenschappen in plaats daarvan in te stellen op false.

Sterker nog, ik betwijfel of er veel legitieme gebruiken zijn voor deze methode, boolean rekwisieten worden op zo'n manier gedaan dat je ze op false instelt in plaats van ze te "verwijderen" zoals hun "attribute" tegenhangers in 1.5


3289
2017-09-12 05:23



Gewoon omwille van nieuwe conventies && het aanpasbaar maken van de toekomst (tenzij dingen drastisch veranderen met ECMA6 (????):

$(document).on('event_name', '#your_id', function() {
    $(this).removeAttr('disabled');
});

en

$(document).off('event_name', '#your_id', function() {
    $(this).attr('disabled','disabled');   
});

51
2017-07-18 11:51



    // Disable #x
    $( "#x" ).prop( "disabled", true );
    // Enable #x
    $( "#x" ).prop( "disabled", false );

Soms moet u het formulierelement zoals invoer of tekstgebied uitschakelen / inschakelen. JQuery helpt je om dit gemakkelijk te maken door het uitschakelen van het kenmerk in te stellen op "uitgeschakeld". Voor bijvoorbeeld:

  //To disable 
  $('.someElement').attr('disabled', 'disabled');

Om uitgeschakeld element in te schakelen, moet je het "disabled" attribuut van dit element verwijderen of de string ervan legen. Voor bijvoorbeeld:

//To enable 
$('.someElement').removeAttr('disabled');

// OR you can set attr to "" 
$('.someElement').attr('disabled', '');

verwijzen :http://garmoncheg.blogspot.fr/2011/07/how-to-disableenable-element-with.html


25
2018-04-07 10:27



$("input")[0].disabled = true;

of

$("input")[0].disabled = false;

12
2017-09-06 14:53



Je kunt dit ergens globaal in je code plaatsen:

$.prototype.enable = function () {
    $.each(this, function (index, el) {
        $(el).removeAttr('disabled');
    });
}

$.prototype.disable = function () {
    $.each(this, function (index, el) {
        $(el).attr('disabled', 'disabled');
    });
}

En dan kun je dingen schrijven als:

$(".myInputs").enable();
$("#otherInput").disable();

7
2017-10-18 13:42



Als u alleen de huidige status wilt omkeren (zoals een gedrag van de schakelknop):

$("input").prop('disabled', ! $("input").prop('disabled') );

4
2017-09-12 16:28



Update voor 2018:

Nu is jQuery niet meer nodig en het is een tijdje geleden document.querySelector  of document.querySelectorAll (voor meerdere elementen) doe bijna precies hetzelfde werk als $, plus meer expliciete getElementById, getElementsByClassName, getElementsByTagName

Uitschakelen van een veld van "input-checkbox" klasse

document.querySelector('.input-checkbox').disabled = true;

of meerdere elementen

document.querySelectorAll('.input-checkbox').forEach(el => el.disabled = true);

2
2018-02-11 18:29



U kunt de methode jQuery prop () gebruiken om het formulierelement in of uit te schakelen of dynamisch te beheren met behulp van jQuery. Voor de methode prop () is jQuery 1.6 en hoger vereist.

Voorbeeld:

<script type="text/javascript">
        $(document).ready(function(){
            $('form input[type="submit"]').prop("disabled", true);
            $(".agree").click(function(){
                if($(this).prop("checked") == true){
                    $('form input[type="submit"]').prop("disabled", false);
                }
                else if($(this).prop("checked") == false){
                    $('form input[type="submit"]').prop("disabled", true);
                }
            });
        });
    </script>

1
2017-08-02 10:26



Ik gebruikte @gnarf antwoord en voegde het toe als functie

   $.fn.disabled = function (isDisabled) {
     if (isDisabled) {
       this.attr('disabled', 'disabled');
     } else {
       this.removeAttr('disabled');
     }
   };

Gebruik het dan als volgt

$('#myElement').disable(true);

0
2017-11-16 10:24



2018, zonder JQuery (ES6)

Alles uitschakelen input:

[...document.querySelectorAll('input')].map(e => e.disabled = true);

onbruikbaar maken input met id="my-input"

document.getElementById('my-input').disabled = true;

De vraag is met JQuery, het is maar FYI.


0
2018-06-04 13:43