La différence et la priorité entre l'utilisation de href et onclick dans la balise HTML a

Cet article partage principalement un article sur l'utilisation, la différence et la priorité de href et onclick dans la balise HTML A. Il a une bonne valeur de référence. Les amis qui ont besoin d'en savoir plus peuvent le lire

Si vous le faites. Si vous n'avez pas défini l'attribut href dans IE6, vous ne répondrez pas au survol. Après un double-clic, le conteneur parent de l'étiquette sera sélectionné à la place de l'étiquette (ce problème existe sous IE).

Le code est le suivant

<a href="javascirpt:fn(this)"> <a onclick="fn(this)">

Supposons que nous ayons une méthode fn qui doit obtenir cet élément, le this transmis par la première méthode est une valeur nulle.

Donc, la manière d'écrire la plus recommandée est

Le code est le suivant

<a href="javascript:void(0)" onclick="fn(this)">

Le code suivant exécute la fonction subgo(),

Le code est le suivant

<a href="javascript:void(0)" onclick="subgo()">点我</a>

Ici, javascript:void(0) n'a pas de fonction réelle. C'est juste un lien mort et la fonction exécutée. est subgo() .

Le code est le suivant

点我与<a href="javascript:void(0)" onclick="subgo()">点我</a>区别。

En fait, #contient une information de localisation. L'ancre par défaut est #top, qui est le haut de la page Web, et javascript:void(. 0) représente uniquement un lien mort. Il n'y a aucune information. Par conséquent, il est préférable d'utiliser void(0)

href qui pointe généralement vers une adresse URL lors de l'appel d'un script. Vous pouvez également appeler du javascript, tel que href="javascript:xxx();". recommandé d'écrire ainsi dans le document :

Le code est le suivant

<a href="http://www.jb51.net/zhongxing/U880/ javascript:void(0)" onclick="xxx();">xx</a>

Cependant, cette méthode provoque parfois des problèmes étranges dans des environnements complexes. Essayez de ne pas utiliser le protocole javascript: comme protocole. attribut href de A. Cela entraînera non seulement un déclenchement inutile de l'événement window.onbeforeunload qui arrêtera la lecture de l'image animée GIF dans IE.

Nous savons que l'événement onclick du lien est exécuté en premier, suivi de l'action sous l'attribut href (saut de page, ou pseudo lien javascript si vous ne souhaitez pas exécuter l'action sous l'attribut href). , onclick doit renvoyer false. Généralement, onclick="xxx();return false;".

Le code source JS de TabPane est écrit comme ceci Puisque onclick ne renvoie pas FALSE, lorsque TABPANE est fermé dans IFRMAE, cela entraînera des problèmes d'exécution de href et d'affichage des pages. La solution consiste à copier le code suivant dans le JSP à l'aide de TAB.

Priorité d'utiliser href et onclick en même temps dans la balise Html A

1 commande

ie 6 : href déclenche d'abord onclick, puis déclenche

Les autres navigateurs déclenchent onlick d'abord, puis href

2 href="javascript: xxx()"

Ceci ne peut pas être passé en paramètre

onclick peut

Le code est le suivant

<a href="javascript:alert(&#39;href event&#39;);" onclick="clickevent(this);">

3 Si la méthode qui est déclenchée le premier renvoie faux, ce dernier événement ne sera pas déclenché

Par exemple,

le code est le suivant

<a href="javascript:alert(&#39;href event&#39;);" onclick="clickevent(this); return false;">

4

b5a63eb323562bbd99b282e6a2c94492 entraînera le positionnement de la page à la position du signet,

5

Pour les raisons 1 et 4,

a également d915eb801073aea935f4dc6f6953df9b 

comme l'exemple suivant.

Nous avons besoin de A pour accéder à href au premier et au deuxième clic, et accéder à une autre adresse après la troisième fois

Le code est le suivant

var href=0
function clicka(obj)
{
 if (href==2)
 {
 obj.href="http://www.baidu.com?qc";
 }else
 {
 href++;
 }
 return true;
}
 <a href="http://www.jb51.net/" target=_blank id="showa" onclick="clicka(this)"> 开屏高速下载 </a>

La différence entre utiliser javascript dans le href et onclick d'une balise

L'événement onclick du lien est exécuté en premier, suivi de l'action sous l'attribut href (saut de page, ou pseudo-lien javascript);

En supposant que href et onclick existent dans le lien, si vous souhaitez que l'action sous l'attribut href ne soit pas exécutée, onclick doit obtenir une fausse valeur de retour. Si vous n'y croyez pas, vous pouvez commenter le return false dans la fonction goGoogle

Si la page est trop longue et comporte une barre de défilement, et que vous souhaitez effectuer des opérations via l'événement onclick du ; lien. Son attribut href doit être défini sur javascript:void(0); au lieu de #, ce qui peut éviter des sauts de page inutiles

Si une fonction avec une valeur de retour est appelée dans l'attribut href du lien, le contenu de la page actuelle sera remplacé par la valeur de retour de cette fonction

sera différente en maintenant la touche Shift enfoncée.

Le problème que j'ai rencontré aujourd'hui est que je ne peux pas accéder à parentNode sous la forme de href dans IE6.0.

Essayez de ne pas utiliser javascript: protocol comme attribut href de A. Cela entraînera non seulement le déclenchement inutile de l'événement window.onbeforeunload, mais empêchera également la lecture de l'image animée GIF dans IE.

C'est tout, j'ai passé beaucoup de temps là-dessus.

[Raison]

Lors de l'utilisation du contrôle CheckBoxList, je souhaite ajouter un lien après chaque case à cocher. En plus de cliquer sur le lien pour réaliser certaines fonctions, je dois également cocher la case. .

Le code est le suivant

<input type="checkbox" name="chk" id="chk">
<label for="chk">选中它<a onclick="this.parentNode.click();" href="http://luwenxiang1990.blog.163.com/blog/#" style="border:solid 1px blue;">[label中的链接]</a></label>

Enfin, il est implémenté à l'aide de parentNode.

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Explication sur l'utilisation de l'attribut href de la balise HTML pour spécifier les chemins relatifs et les chemins absolus

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!