Sélecteur submit
Le sélecteur :submit sélectionne les éléments de type
submit,
qui sont des boutons d'envoi de formulaire.
Généralement, le sélecteur :submit est appliqué aux boutons
ou aux éléments d'entrée. Il faut garder à l'esprit que certains
navigateurs perçoivent l'élément button comme
ayant [type='submit'] implicitement, tandis que
d'autres font le contraire. Pour garantir un fonctionnement correct,
spécifiez toujours la propriété type.
Étant donné que :submit ne fait pas partie de la spécification CSS,
pour améliorer les performances dans les navigateurs modernes,
il est préférable d'utiliser [type='submit'] à la place.
Syntaxe
Voici comment nous sélectionnons les éléments de type submit :
$(':submit');
Exemple
Conformément à la théorie mentionnée ci-dessus,
sélectionnons tous les éléments de type submit,
qui sont des descendants des éléments td.
Appliquons à ces td un fond vert
et une bordure rouge à l'aide de la méthode
css :
<form>
<table border="1" cellpadding="10" align="center">
<tr><th>Element</th></tr>
<tr><td><input type="button" value="button"></td></tr>
<tr><td><input type="file"></td></tr>
<tr><td><input type="password"></td></tr>
<tr><td><button>button</button></td></tr>
<tr><td><input type="reset"></td></tr>
<tr><td><input type="submit"></td></tr>
<tr><td><input type="radio" name="test"></td></tr>
<tr><td><input type="checkbox"></td></tr>
<tr><td><button type="submit">button</button></td></tr>
<tr><td><input type="text"></td></tr>
</table>
</form>
$('td:submit')
.parent('td')
.css({background: 'green', border: '2px red solid'})
.end();
$('form').submit(function(event) {
event.preventDefault(); // empêche l'envoi du formulaire
});
