11497 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
J'utilise le code jquery suivant
$('#next').click(function() {
$('.current').removeClass('current').hide()
.next().show().addClass('current');
if ($('.current').hasClass('last')) {
$('#next').attr('disabled', true);
}
$('#prev').attr('disabled', null);
});

et la balise html correspondante :
<button id="next">Next</button>

Et tout fonctionne dans un joyeux roulement de mecanique.

Je voudrais tout simplement ne plus utiliser la balise button mais utiliser une div existante (contenant une image) pour faire le job a la place du button.
Merci pour votre aide precieuse!

Dan
Ne. Fait. Pas. Ça.

Accessibilité, logique, sémantique, pourquoi vouloir une div ?

Un bouton déclenche une action, c’est le principe. Une div… Ben elle ne fait rien du tout, c’est le principe aussi.

Si c’est seulement pour mettre une image, tu peux la mettre dans le bouton :
<button><img /></button>

ou même lui ajouter un background-image, tout bêtement.

En aucun cas une action de l’utilisateur ne doit se faire sur un élément «inerte». Jamais.
Bonjour.

En tout état de cause, rien ne t'empêche de le faire sur une div (tu peux par contre oublier l'attribut disabled en tant que tel), mais Ten a raison, pourquoi vouloir changer ? Ta logique de bouton est "logique" ici.
+1 par rapport aux avis précédents. C'est moins accessible, et c'est pas du tout logique.

Techniquement, la solution pour rendre une div focusable existe, mais la plupart du temps ce n'est pas du tout pertinent et il vaudrait mieux utiliser un lien ou un bouton, autant pour une question de logique sémantique que d'accessibilité naturelle.

Je sais que certains navigateurs ajoutent des bordures et des effets d'interaction aux boutons. Si c'est juste une question d'apparence, tu peux toujours les faire sauter avec du CSS.

ET en passant, c'est « ne fais pas ça »