Redirection sur l'ancre d'une même page

Bonjour tout le monde,

Je viens vers vous après des heures de recherches et de tests infructueux.

Voici la page sur laquelle je teste le script : PAGE DE TEST

Je cherche à faire quelque chose de simple a priori, mais impossible de le faire fonctionner sous tous les navigateurs. Je souhaiterais, via JS obligatoirement (sinon ça m'obligerait à changer tout le code) :
- effacer une page et mettre un msg d'alerte (ça fonctionne)
- rediriger vers une ancre de cette même page (le problème est là)

Voici le code, dont le code JS qui semble le plus logique :

<p id="test" style="cursor:pointer;">CLIQUEZ ICI</p>

<p id="ancre" style="margin:400px 0;">ICI l'ancre</p>

$("#test").click(function() {
	$('#content').empty().fadeIn().append('<p class="notification valide">redirection en cours</p>');
	setTimeout(function(){
		window.location.replace("http://www.pronostics-formule1.fr/xtestx.php#ancre");
		window.location.reload();
	},1000);
});

Comportement sous les différents navigateurs :

- FF 20 : ça marche très bien
- Chrome 26 : il y a refresh, ça descend à l'ancre, puis ça remonte
- IE 10 : il y a refresh, mais aucun effet vis à vis de l'ancre
- Opera : idem IE 10.


J'ai essayé beaucoup de choses :
- window.location.reload();
- window.location.reload(true);
- window.location.reload(false);
- window.location.href..
- etc...

Rien y fait, je suis démuni.

En espérant que vous pourrez m'aider.
Modifié par Bertrand40 (07 Apr 2013 - 09:18)

Pourquoi pas faire ça simplement en html ? (href='#ancre') ?


Sinon pour chrome, je dirais que c'est la ligne avec reload qui le gène. Tu l'envoies dans un coin de la page, puis tu recharges.

En mettant d'abord le reload puis le remplace ? (même si je capte pas l'intérêt de recharger la page dans ton cas)

Salut,

Ben en fait tu peux pas comprendre pourquoi parce que j'ai pas été assez explicite. Désolé.

En fait il faut s'imaginer sur une page de forum :

1- je poste le message

2- via jQuery "j'efface" la page et marque que c'est validé

$('#content').empty().fadeIn().append('<p class="notification valide">redirection en cours</p>');

3- insertion du msg via Ajax

4- je veux recharger la même page pour afficher le ou les messages qui ont été postés entre temps : c'est là que le comportement n'est pas le même en fonction des navigateurs.. à vrai dire il n'y a que FF avec qui ça fonctionne

Sinon oui tu as raison, le pb c'est bien le reload. Que j'ajoute true (rechargement serveur) ou false, ça ne fait pas descendre à l'ancre. En fait le reload ne simule pas du tout le clic sur un lien.

Pour ça j'ai trouvé un moyen qui marche pas terrible : avec un window.location.hash j'arrive à faire défiler vers l'ancre, après chargement de la page (toujours avec JQuery). Mais ça ne marche pas bien, très souvent le défilement s'arrête avant l'ancre.

Bref c'est qqchose de simple en apparence, mais un vrai casse-tête pour moi. J'y ai déjà passé plus de 5 heures..