De button-selector
De selector :button selecteert knoppelementen en
alle elementen met het type button. Zie de
tags button,
input
met het type button.
Het equivalent van $(':button') is
$('button'), $("input[type='button']").
Aangezien :button niet tot de CSS-specificatie behoort,
is het voor betere prestaties in moderne
browsers beter om eerst elementen te filteren met
een pure CSS-selector, en vervolgens
.filter(':button') toe te passen.
Syntaxis
Zo selecteren we knoppen:
$(':button');
Voorbeeld
Laten we, volgens de bovenstaande theorie,
alle knoppen selecteren en ze een groene achtergrond en
een rode rand geven, door ze de klasse marked
toe te voegen met behulp van de methode
addClass:
<form>
<input type="button" value="button">
<input type="file">
<button>button</button>
<input type="reset">
<input type="radio">
<input type="text">
</form>
.marked {
background-color: green;
border: 2px red solid;
}
$(':button').addClass('marked');
$('form').submit(function(event) {
event.preventDefault(); // voorkomt het verzenden van het formulier
});