Ajouter un attribut désactivé à l'élément d'entrée en utilisant Javascript

Question

J'ai une zone de saisie et je veux qu'elle soit désactivée et en même temps la cacher pour éviter des problèmes lors du portage de mon formulaire.

Jusqu'à présent, j'ai le code suivant pour cacher mon entrée:

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show().find('.longboxsmall').hide(); 
}); 

Ceci est l'entrée qui sont cachés à la suite:

<input class="longboxsmall" type="text" /> 

Comment puis-je ajouter aussi l'attribut désactivé à l'entrée?

Answer 1

$("input").attr("disabled", true); à partir de ... Je ne sais plus.

Nous sommes en décembre 2013 et je n'ai aucune idée de ce que je peux vous dire.

D'abord c'était toujours .attr(), alors c'était toujours .prop(), donc je suis revenu ici mis à jour la réponse et l'ai rendu plus précis.

Puis un an plus tard, jQuery a de nouveau changé d'avis et je ne veux même pas garder trace de cela.

Longue histoire courte, en ce moment, c'est la meilleure réponse: "vous pouvez utiliser les deux ... mais cela dépend."

Vous devriez lire cette réponse à la place: https://stackoverflow.com/a/5876747/257493

Et leurs notes de version de ce changement sont inclus ici:

Ni .attr() ni .prop() doit être utilisé pour obtenir/réglage valeur. Utilisez la méthode .val() à la place (bien que l'utilisation de .attr ("value", "somevalue") continuera à fonctionner, comme c'était le cas avant la version 1.6).

Résumé de la méthode Utilisation

Le .prop() préféré doit être utilisé pour les attributs/propriétés booléennes et pour les propriétés qui n'existent pas en html (comme window.location). Tous les autres attributs (ceux que vous pouvez voir dans le HTML) peuvent et doivent continuer à être manipulés avec la méthode .attr().

Ou en d'autres termes:

".prop = non-document de substance"

".attr" = document de choses

... ...

Puissions-nous tous apprendre une leçon ici sur la stabilité de l'API ...

Answer 2

Il suffit d'utiliser la méthode attr() jQuery

$(this).closest("tr").next().show().find('.longboxsmall').attr('disabled', 'disabled'); 

Answer 3

Vous pouvez obtenir l'élément DOM, et définir directement la propriété disabled.

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show() 
      .find('.longboxsmall').hide()[0].disabled = 'disabled'; 
}); 

ou s'il y a plus d'un, vous pouvez utiliser each() pour définir tous:

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show() 
      .find('.longboxsmall').each(function() { 
       this.style.display = 'none'; 
       this.disabled = 'disabled'; 
      }); 
}); 

Answer 4

$(element).prop('disabled', true); //true|disabled will work on all 
$(element).attr('disabled', true); 
element.disabled = true; 
element.setAttribute('disabled', true); 

Toutes les solutions ci-dessus sont parfaitement valables. Choisissez celui qui correspond le mieux à vos besoins.

Answer 5

Si vous utilisez jQuery, il existe plusieurs façons de définir l'attribut désactivé.

var $element = $(...); 
    $element.prop('disabled', true); 
    $element.attr('disabled', true); 

    // The following do not require jQuery 
    $element.get(0).disabled = true; 
    $element.get(0).setAttribute('disabled', true); 
    $element[0].disabled = true; 
    $element[0].setAttribute('disabled', true); 

Answer 6

Code de travail de mes sources:

HTML MONDE

<select name="select_from" disabled>...</select> 

---

JS MONDE

var from = jQuery('select[name=select_from]'); 

//add disabled 
from.attr('disabled', 'disabled'); 



//remove it 
from.removeAttr("disabled");