J'ai une page avec deux onglets que je veux pouvoir basculer avec JavaScript, mais définissez également l'ancre (par exemple, Par défaut, le contenu de l'onglet est en deux divs, un sous l'autre, et la balise d'ancrage fera défiler jusqu'à la bonne, avec JS désactivé.
avec JS activé, les classes CSS sont appliquées pour les rendre comme des onglets. Chaque onglet lie à chaque ancre, mais lorsque vous cliquez sur les onglets, la page fait défiler la page sur l'onglet. Si je retourne faux de la fonction OnClick, l'URL ne change pas pour inclure l'ancre.
Comment puis-je modifier l'URL de navigateur à page.html # onglet1 ) dans l'URL pour le signet / liaison. < / p>
page.html # onglet1 mais pas défiler jusqu'à # onglet1 ??
6 Réponses :
window.location.hash = 'tab1'; might work.
Non, cela ne fera pas, cela fera défiler jusqu'à l'ancre (sauf dans Safari dans certains cas, grâce à son emplacement brisé.Hash support).
Pourriez-vous avoir du javascript qui a changé les noms d'ancrage, définissez la fenêtre.Location.hash, puis modifié les noms d'ancrage?
(J'ai confirmé que AndynormancX a raison et définir la fenêtre.Location.Location défilte la vue, mais je suis trop paresseux pour tester si la création d'une ancre dans le DOM to window.Location. / p>
J'ai joué avec cela pendant un moment, car j'avais initialement pas cru (j'utilise le JQuery History Plugin pour obtenir un comportement similaire).
Et je suis exclu. Je ne pense pas que tu peux. Ce que vous pourrait faire, comme une solution de contournement, est Utilisez JavaScript pour définir le hachage quelque chose de différent de ce qui est réellement sur la page . Puis utilisez JavaScript sur chargement pour lire le hachage et remplir le contenu correct. Je fais cela sur mon site . Donc, dans ce scénario, les utilisateurs sans JavaScript seraient défilés, les utilisateurs avec JavaScript garderaient la chaîne d'historique et ne deviendront que Wacky lorsque des gens sans envoyer de liens avec des personnes avec (ou vice-versa).
Cela fonctionne, et je viens de découvrir que c'est ce que le validator.w3.org fait. En fin de compte, j'ai décidé de fermer la création de l'ancre à la bonne place des navigateurs non-JS, car les deux divs ne sont pas très grands, et comme vous dites des liens d'utilisateurs activés par JS pour les utilisateurs non-JS arrête de fonctionner.
var Namespace = {
var timer, scroll;
}
// Onclick
Namespace.scroll = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
Namespace.timer = setInterval(function() { scrollTo(0, Namespace.scroll) }, 100);
location.hash = this.href;
clearInterval(Namespace.timer);
Un piratage rapide: Ceci modifie l'ID de l'élément HTML avant et après avoir changé le hachage de l'URL. Travaille pour moi, mais pourrait aussi bien casser quelque chose. Cela empêche le navigateur de faire défiler un changement de hachage, car il n'y a pas d'élément HTML avec cet identifiant entre.
Cela a fonctionné pour moi (n'était que de moitié avec précaution à cela). Il y a certainement une qualité de piratage, mais n'a pas vu de problèmes jusqu'à présent.
J'ai trouvé une belle solution ici: http : //lea.verou.me/2011/05/change-url-hash-without-page-jump/
Utilisez une EventDefault sur par exemple un événement de clic