Comment écrire un lien exécutant un code JavaScript ?
Pour écrire un lien en JavaScript, on utilise l'attribut onClick qui appelle du code JavaScript quand on clique sur le lien. Mais que faut-il mettre dans l'attribut href qui indique l'adresse de destination ?
Si l'on souhaite écrire un lien en utilisant le langage JavaScript, on utilise l'attribut onClick qui appelle du code JavaScript lorsque l'on clique sur le lien. Mais que faut-il mettre dans l'attribut href qui indique l'adresse de destination ? Il y a plusieurs possibilités. La méthode la plus courante consiste à mettre un # afin que le lien ne redirige pas vers une autre page.
<a href=# onclick=return maFonction()>Lien</a>
Ce n'est pas la méthode la plus efficace en développement. Il est préférable d'utiliser javascript:void(0), qui est l'équivalent en JavaScript de Ne fais rien.
<a href=javascript:void(0); onclick=maFonction()>Lien</a>
Il y a trois raisons qui rendent plus facile et efficace l'utilisation de la deuxième méthode. La fonction développée doit retourner la valeur faux à la fin et le fait de mettre # oblige à bien mettre la directive return dans l'attribut du onClick pour que la fonction retourne faux et empêche le lien de fonctionner.
<script>
function maFonction()
{
//code
return false;
}
</script>
<a href=# onclick=return maFonction();>lien</a>
La deuxième raison est la directive qui retourne faux à la fin de la fonction. Il faut bien penser à empêcher tous les cas d'erreur qui peuvent intervenir dans le code et empêcher la fonction d'arriver à la fin. Le fait d'utiliser javascript:void(0); évite tous ces problèmes car les retours ne sont plus utiles et l'action de redirection déclenchée par un clic sur le lien ne se produira pas, quoiqu'il arrive.
La dernière raison est le cas où vous attribuez dynamiquement la fonction sur un lien. Vous n'avez pas à adapter spécialement le code de la fonction pour gérer le fait qu'elle s'exécute lors d'un clic sur un lien. Votre travail est plus facile et votre code est plus dynamique.