SELFHTML: HTML / Formulaires / Boutons pouvant être cliqués

SELFHTML/Quickbar HTML Formulaires

	Boutons pouvant être cliqués
	Définir des boutons pouvant être cliqués (traditionnels) Définir des boutons pouvant être cliqués (HTML 4.0) Autres possibilités

Définir des boutons pouvant être cliqués (traditionnels)

Exemple d'affichage: aperçu

Vous pouvez définir des boutons pouvant être cliqués n'ayant aucune signification particulière. De tels boutons définissables à souhait ne sont judicieux qu'en relation avec des langages de programmation comme JavaScript. En règle générale, ils sont employés pour exécuter des liens ou d'autres commandes dirigées par JavaScript.

La possibilité décrite ici a l'avantage d'être également interprétée par des navigateurs plus anciens (Netscape depuis la version 2.x, Explorer Internet MS depuis la version 3.x).

Exemple:

<p>Si JavaScript fonctionne chez vous, le bouton suivant signifie la même chose que   
le bouton retour du navigateur WWW:</p>
<input type=button value="retour" onClick="history.back()">

Explication:

Avec <input type=button ...> vous définissez un bouton (input = entrée). Vous déterminez l'inscription du bouton grâce à la mention value= (value = valeur). La mention doit être placée entre guillemets. Pour mentionner ce qui doit se passer quand le bouton est cliqué, vous pouvez par exemple utiliser le Event-Handler onClick= de JavaScript. Derrière le signe égal mentionnez une commande JavaScript, par exemple l'appel d'une fonction JavaScript que vous avez écrite vous-même ou bien -comme dans l'exemple - une commande JavaScript simple.

Définir des boutons pouvant être cliqués (HTML 4.0)

Exemple d'affichage: aperçu

À partir de HTML 4.0 les boutons pouvant être cliqués peuvent enfin s'appeler comme ils s'appellent à savoir Button. De tels boutons sont plus souples que les boutons traditionnels parce qu'ils peuvent aussi avoir un contenu défini comme par exemple un graphique.

L' Explorer Internet MS interprète cette nouvelle commande à partir de la version 4.x, Netscape ne connaît pas encore la commande dans sa version 4.x.

Exemple:

<p>Si JavaScript fonctionne chez vous, le bouton suivant signifie la même chose que   
le bouton retour du navigateur WWW:</p>
<button name="clique" type="button"
  value="retour" onClick="history.back()">
 <img src="clique.gif" alt="cliquer">
 <p>!RETOUR!</p>
</button>

Explication:

Introduisez la définition d'un tel bouton avec <button>. Ce repère nécessite un repère de fermeture </button>, avec lequel vous terminez la définition du bouton.

Entre les repères d'ouverture et de fermeture peuvent se trouver des contenus. Tout ce que vous notez entre <button> et </button>, est affiché comme "inscription" du bouton. Cela peut aussi tout à fait être des références de graphiques, comme dans l'exemple ci-dessus. Ces contenus seront placés sur la surface du bouton alignés au centre.

Dans le repère d'ouverture <button> notez les différentes mentions concernant le bouton La mention. type=button peut sembler un peu étrange alors que le repère porte déjà ce nom. Notez pourtant cette mention pour tous les boutons que vous utilisez pour des langages Script. Car à l'aire du repère <button> vous pouvez aussi définir deux autres types de boutons à savoir les bouton d'envoi et bouton d'interruption.

Avec l'attribut name= vous pouvez affecter un nom au bouton. C'est sous ce nom que JavaScript par exemple pourra s'adresser au bouton. Avec l' attribut value= vous pouvez déterminer l'inscription du bouton au cas où vous ne notez pas de contenu entre <button> et </button>. N'oubliez pas cependant que l' Explorer Internet MS 4.0 ignore cette mention et que sans contenu, le bouton sera affiché sans inscription.

Pour mentionner ce qui doit se passer quand le bouton est cliqué, vous pouvez par exemple utiliser le Event-Handler onClick= de JavaScript. Derrière le signe égal mentionnez une commande JavaScript, par exemple l'appel d'une fonction JavaScript que vous avez écrite vous-même ou bien -comme dans l'exemple - une commande JavaScript simple.

Attention:

Les graphiques qui sont affichés comme contenu du bouton, ne peuvent contenir aucun attribut usemap= pour graphiques composés de liens.

Autres possibilités

Le repère <input> peut comprendre des attributs universels.

Il est également tout à fait permis d'utiliser des feuilles de style CSS sur des éléments de formulaire. Malheureusement Netscape n'interprète pas encore ce genre de possibilités dans sa version 4.x. L' Explorer Internet MS 4.x interprète les feuilles de style CSS en relation avec les éléments de formulaires. Pour cela il vous faut d'abord savoir comment définir des feuilles de style. Ensuite vous serez en mesure d'utiliser des mentions de feuilles de style. Vous pouvez par exemple utiliser les mentions de feuilles de style suivantes sur le repère <input>:
Formatage de police
Couleurs et images d'arrière plan
Positionner des éléments


après:	Boutons-fichier
avant:	Boutons radio et boites de vérification

SELFHTML/Quickbar HTML Formulaires