comment déboguer les ancres de signets ne fonctionne pas

J'ai une page html vraiment compliquée et j'ai ajouté quelques ancres de signet à divers points. Les ancres ressemblent à ceci:comment déboguer les ancres de signets ne fonctionne pas

<a href="#foo bar">click here for foo bar</a> 
lorum ipsum etc 
<a name="foo bar">foo bar</a>

Mais quand vous cliquez dessus, rien ne se passe - l'URL dans la barre d'adresse ne change pas, et la page ne se déplace pas. Si je retire mes ancres et les mets dans une page plus simple, elles commencent à travailler, donc je pense que quelque chose doit interférer avec la navigation d'une façon ou d'une autre, mais je ne peux pas penser à la clouer. Je m'interrogeais sur une erreur dans le javascript quelque part qui annulait la navigation, mais la page a des milliers de lignes de javascript et je n'ai rien trouvé de suspect pour le moment.

Le problème se produit à la fois dans Chrome et Firefox.

Comment puis-je corriger ce problème?

MISE À JOUR: Serait-ce un problème de CSS? les ancres cibles se trouvent dans un <div> avec la propriété CSS overflow:auto;. Cela provoque l'apparition de la barre de défilement à l'intérieur du div au lieu du bord de la page - ce qui n'était pas le cas avec ma page de texte simple.

MISE À JOUR 2: débordement: l'auto ne casse pas les ancres nommées; tested with a simple example

Source

2012-02-01 Colin Pickard

Les espaces sont-ils autorisés dans les signets? – f2lollpll

Je commencerais par chercher du JavaScript qui empêche la propagation de l'événement click ou empêche l'action par défaut. Si vous utilisez jQuery, http://api.jquery.com/event.stopPropagation/ et http://api.jquery.com/event.preventDefault/ – j08691

@sjums, j'ai essayé de copier les signets sur une simple page de test, et ils ont bien fonctionné avec des espaces. Je vais expérimenter quand même - tout vaut la peine d'être essayé à ce stade. –

Ce fut certainement un problème de script plutôt que la syntaxe de l'ancre. J'ai finalement (accidentellement) débogué le problème en ajoutant un javascript invalide au gestionnaire de click(), qui a cassé le gestionnaire de clic mais a fait que les ancres aient recommencé à fonctionner. J'ai pu procéder à partir de là.

Source

2012-02-08 14:56:27

Mais à partir de la question que vous avez posée, je ne suis pas sûr que cela soit considéré comme la «réponse acceptée» . Après avoir fait un test rapide, il semble que l'utilisation de l'attribut id (la première réponse) devrait suffire. – webdevinci

Essayez ceci:

<a href="#foo bar">click here for foo bar</a> 
lorum ipsum etc 
<a id="foo bar">foo bar</a>

Donc, fondamentalement changer votre attribut name pour un id un.

Aussi ... Je pense que ce sera fondamentalement à la recherche de "foo" plutôt que "foo bar". Je n'ai pas testé cela cependant.

Source

2012-02-08 14:25:59 diggersworld

merci pour votre réponse. Il s'est avéré que mes ancres fonctionnaient bien, c'était juste un dump javascript à l'origine de mon problème. En passant, j'ai fait un test rapide des ancres; vous pouvez le voir ici: http://jsfiddle.net/wFcnk/ –

ancres nommées doivent avoir un avoir un nom un mot ou l'identifiant (id mieux, car le nom est depecated)

cela fonctionne:

<a href="#foo-bar">click here for foo bar</a> 
    lorum ipsum etc 
<a id="foo-bar">foo bar</a>

Source

2012-02-08 14:38:33 Evert

merci pour votre réponse. Je vais changer mon code pour utiliser id pour la compatibilité future, bien qu'il semble que pour l'instant les ancres multi-mots fonctionnent réellement - consultez cet exemple: http://jsfiddle.net/wFcnk/ –

Eh oui, je l'ai essayé après répondre et cela semble fonctionner (bizarre!), mais selon w3c, seules les chaînes correspondant au motif [A-Za-z] [A-Za-z0-9: _.-] * devraient être utilisées pour les identifiants. Par exemple: "et doit contenir au moins un caractère La valeur ne doit pas contenir de caractères d'espace." d'ici: http://www.w3.org/TR/html5/elements.html#the-id-attribute – Evert

comment déboguer les ancres de signets ne fonctionne pas

Répondre

Questions connexes