Wechseln zu einem bestimmten Ort in einer Webseite

Question

Ich habe Links wie folgt:

<a class="faq_text_header_jump" href="#general_questions">General Questions</a><br> 
    <a class="faq_text_header_jump" href="#how">How do i..</a><br> 
    <a class="faq_text_header_jump" href="#once_you_book">Once you've booked lessons..</a> 

Und ein Ziel wie folgt:

<div class="faq_text_section_header" id="how"><h2>How do I...?</h2></div> 

Aber mein 2. und 3. Links funktionieren nicht.

Sehen Sie ein Beispiel hier: http://lessonshark.com/dev1/homes/faq

Answer 1

HTML, eine Lösung für das hat.

Verwendung

<a name="target"> 

die Position in der Seite, die Sie

<a href="page.html#target"> 

Answer 2

Sie benötigen einen benannten Anker irgendwo in Ihrem Dokument springen möchten zu markieren.

einen benannten Anker erstellen, verwenden Sie einfach HTML wie folgt aus:

<a name="anynameyoulike"></a> 

Dann können Sie auf der Seite mit einem Link wie dieser zu diesem Punkt zurückspringen:

<a href="#anynameyoulike">Jump to Named Anchor</a> 

Answer 3

Verwenden das id Attribut, um das Ziel der Verbindung anzugeben. Dies ist die empfohlene Praxis, obwohl die ältere <a name=...>...</a> auch funktioniert, obwohl es begrenzter ist. Was Sie nicht müssen tun unter keinen Umständen ist das Ziel zweimal mit dem gleichen Namen angeben. Derzeit ist das Markup hat

<a name="how_do_i"> 
    <div class="faq_text_section_header" id="how_do_i" >How do I...?</div></a> 

Dies ist ungültig per HTML 4.01 und XHTML 1.0 (obwohl in HTML5 Entwürfe erlaubt), da ein a Element kein div Element enthalten. Im Ernst, das macht how_do_i doppelt definiert, was fast alles verursachen kann. Fix dies nur

<div class="faq_text_section_header" id="how_do_i" >How do I...?</div> 

und stellen Sie sicher, dass Ihr Link href="#how_do_i" verwendet (wie jetzt, aber die Frage, sagte etwas anderes). Ziehen Sie in Betracht, div eine h2 (und stimmen Sie das Stylesheet entsprechend), da es wirklich eine Überschrift ist.

Beachten Sie auch, dass in der Verbindung,

<a class="faq_text_header_jump"href="#how_do_i">How do i..</a> 

sollte es einen Platz vor href sein. Dies ist nur formale Syntax, aber es ist am besten, es richtig zu machen, so dass Sie einen Validator effizient verwenden können.