Domanda Disabilita / abilita un input con jQuery?


$input.disabled = true;

o

$input.disabled = "disabled";

Qual è il modo standard? E, al contrario, come abilitare un input disabilitato?


1910
2017-09-12 05:21


origine


risposte:


jQuery 1.6+

Per cambiare il disabled proprietà dovresti usare il .prop() funzione.

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

jQuery 1.5 e sotto

Il .prop() la funzione non esiste, ma .attr() fa simile:

Imposta l'attributo disabilitato.

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

Per riattivare, il metodo corretto è da usare .removeAttr()

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

In qualsiasi versione di jQuery

Puoi sempre fare affidamento sull'oggetto DOM reale ed è probabilmente un po 'più veloce delle altre due opzioni se hai a che fare solo con un elemento:

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

Il vantaggio di usare il .prop() o .attr() metodi è che è possibile impostare la proprietà per un gruppo di elementi selezionati.


Nota: In 1.6 c'è a .removeProp() metodo che suona molto removeAttr(), ma ciò NON DEVE ESSERE UTILIZZATO su proprietà native come 'disabled'  Estratto dalla documentazione:

Nota: non utilizzare questo metodo per rimuovere proprietà native come selezionato, disabilitato o selezionato. Questo rimuoverà completamente la proprietà e, una volta rimosso, non può essere aggiunto di nuovo all'elemento. Usa .prop () per impostare invece queste proprietà su false.

In effetti, dubito che ci siano molti usi legittimi per questo metodo, i puntelli booleani sono fatti in modo tale che dovresti impostarli su false invece di "rimuoverli" come le loro controparti "attributo" nella 1.5


3289
2017-09-12 05:23



Solo per nuove convenzioni e per renderlo adattabile in futuro (a meno che le cose non cambino drasticamente con ECMA6 (????):

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

e

$(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 );

A volte è necessario disabilitare / abilitare l'elemento del modulo come input o textarea. Jquery ti aiuta a farlo facilmente impostando l'attributo disabilitato su "disabilitato". Ad esempio:

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

Per abilitare l'elemento disabilitato è necessario rimuovere l'attributo "disabled" da questo elemento o svuotare la sua stringa. Ad esempio:

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

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

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


25
2018-04-07 10:27



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

o

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

12
2017-09-06 14:53



Puoi metterlo da qualche parte nel tuo codice globale:

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

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

E poi puoi scrivere cose come:

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

7
2017-10-18 13:42



Se si desidera solo invertire lo stato corrente (come un comportamento del pulsante di attivazione / disattivazione):

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

4
2017-09-12 16:28



Aggiornamento per il 2018:

Ora non c'è bisogno di jQuery ed è passato un po 'di tempo da allora document.querySelector  o document.querySelectorAll (per più elementi) fa quasi esattamente lo stesso lavoro di $, più altri espliciti getElementById, getElementsByClassName, getElementsByTagName

Disabilitare un campo della classe "input-checkbox"

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

o più elementi

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

2
2018-02-11 18:29



Ho usato la risposta @gnarf e l'ho aggiunta come funzione

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

Quindi utilizzare in questo modo

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

0
2017-11-16 10:24



2018, senza JQuery (ES6)

Disabilitare tutto input:

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

disattivare input con id="my-input"

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

La domanda è con JQuery, è solo FYI.


0
2018-06-04 13:43