Quelle est la différence entre disabled="disabled" et readonly="readonly" pour les champs D'entrée HTML?

j'ai lu un peu là-dessus, mais je n'arrive pas à trouver quoi que ce soit de solide sur la façon dont les différents navigateurs traitent les choses. Je suis en train de construire une application qui doit être conforme à la Section 508 (accessible au lecteur d'écran) et qui fonctionne correctement depuis IE 6.

330
demandé sur Adrien Be 2011-10-11 22:28:42

5 réponses

Un readonly élément est tout simplement pas modifiable, mais est envoyé lorsque la fonction form soumet. un disabled l'élément n'est pas modifiable et n'est pas envoyé sur soumettre. Une autre différence est que les éléments readonly peuvent être concentrés (et se concentrer quand" tabbing "à travers un formulaire) tandis que les éléments disabled ne peuvent pas.

plus d'informations à ce sujet dans ce grand article ou la définition par w3c . Pour citer la partie importante:

Différences Fondamentales

The Disabled attribut

  • les valeurs pour les éléments de forme désactivés ne sont pas passées à la méthode du processeur. Le W3C appelle cela un élément de succès.(Cela fonctionne de la même pour cochez les cases qui ne sont pas cochées.)
  • certains navigateurs peuvent outrepasser ou fournir un style par défaut pour les éléments de forme désactivés. (Gris ou estampage texte) Internet Explorer 5.5 est particulièrement désagréable à ce sujet.
  • les éléments de forme désactivés ne reçoivent pas de mise au point.
  • Désactivé les éléments de formulaire sont ignorés dans la navigation de tabulations.

L'Attribut Lecture Seule

  • tous les éléments de forme n'ont pas un attribut readonly. La plupart des à noter, les éléments <SELECT> , <OPTION> , et <BUTTON> n'ont pas seulement attributs (bien que tous deux aient des attributs handicapés)
  • Les navigateurs
  • ne fournissent aucune rétroaction visuelle par défaut que l'élément de formulaire est lu seulement. (Cela peut être un problème... voir ci-dessous.)
  • les éléments de formulaire avec l'ensemble d'attributs readonly seront passés au processeur de formulaire.
  • Lire uniquement les éléments de formulaire peut recevoir le focus
  • les éléments de forme en lecture seule sont inclus dans la navigation sous forme d'onglet.
582
répondu oezi 2018-08-01 07:11:46

aucun événement ne se déclenche lorsque l'attribut de l'élément est désactivé.

aucun des éléments ci-dessous ne sera déclenché.

$("[disabled]").click( function(){ console.log("clicked") });//No Impact
$("[disabled]").hover( function(){ console.log("hovered") });//No Impact
$("[disabled]").dblclick( function(){ console.log("double clicked") });//No Impact

alors que readonly sera déclenché.

$("[readonly]").click( function(){ console.log("clicked") });//log - clicked
$("[readonly]").hover( function(){ console.log("hovered") });//log - hovered
$("[readonly]").dblclick( function(){ console.log("double clicked") });//log - double clicked
79
répondu Hrishabh Gupta 2013-09-14 04:59:21

désactivé signifie qu'aucune donnée de cet élément de formulaire ne sera soumise lorsque le formulaire est soumis. En lecture seule, toutes les données de l'élément seront soumises, mais l'utilisateur ne peut pas les modifier.

par exemple:

<input type="text" name="yourname" value="Bob" readonly="readonly" />

Ce soumettra la valeur "Bob" pour l'élément "votrenom".

<input type="text" name="yourname" value="Bob" disabled="disabled" />

ceci ne soumettra rien pour l'élément"votrenom".

29
répondu Michael Irigoyen 2011-10-11 18:30:58

éléments avec l'attribut Disabled ne serait pas soumis ou peut dire que leurs valeurs ne serait pas affiché avec la demande.

c'est à dire

<input type="textbox" name="field" value="field" disabled="disabled" />

différence

  • les commandes désactivées ne reçoivent pas de mise au point.
  • Les commandes
  • désactivées sont ignorées dans la navigation à tabulations.
  • Les commandes désactivées
  • ne peuvent pas être affichées avec succès.

attribut dans le cas où vous voulez afficher les données du champ.

c'est à dire

<input type="textbox" name="field" value="field" readonly="readonly" />
  • les éléments en lecture seule reçoivent la mise au point mais ne peuvent pas être modifiés par l'utilisateur.
  • Les éléments en lecture seule
  • sont inclus dans la navigation à tabulations.
  • Les éléments en lecture seule
  • sont affichés avec succès.
8
répondu user1787700 2015-06-19 09:12:05

comme les autres réponses (disabled n'est pas envoyé au serveur, readonly est) mais certains navigateurs empêchent la mise en évidence d'un formulaire désactivé, alors que read-only peut encore être mis en évidence (et copié).

http://www.w3schools.com/tags/att_input_disabled.asp

http://www.w3schools.com/tags/att_input_readonly.asp

un champ en lecture seule ne peut pas être modifié. Cependant, un utilisateur peut onglet, mettez-le en surbrillance et copier le texte à partir d'elle.

3
répondu Tim 2011-10-11 18:33:14