Wie springe ich mit js zum angegebenen Div, nachdem ich auf einen bestimmten Teil der aktuellen Seite geklickt habe?

Im Prozess der Website-Erstellung ist es manchmal notwendig, eine solche Funktion zu implementieren. Wenn Sie mit der Maus auf eine bestimmte Position auf der aktuellen Seite klicken, wird diese direkt zu einer anderen angegebenen Position auf der aktuellen Seite verschoben. Tatsächlich ist diese Funktion für erfahrene Programmierer sicherlich nicht schwierig, aber für Anfänger ist sie schwierig, vor allem weil sie nicht wissen, wo sie anfangen sollen. In diesem Artikel werden Ihnen zwei Methoden vorgestellt, mit denen js zur Seite springen und die Div-Position angeben kann.

1. Implementierung durch HTML-Ankerpunkt:
Wenn die Stelle, auf die wir klicken möchten, um zu springen, ein HTML-Ankerpunkt ist, d. h. auf einen A-Tag-Hyperlink klicken, um zu springen, können wir den href ändern Das A-Tag-Attribut zeigt direkt auf das Div, das zur angegebenen Position springt. Das Codebeispiel lautet wie folgt:

<a href="#abc">点击跳转</a>
<div id="abc">将要跳转到这里</div>

Hinweis: Durch Klicken auf den A-Link oben wird zum Div mit der ID = „abc“ gescrollt. Auf derselben Seite ist zu beachten, dass die ID des Div, das zur angegebenen Position springt, eindeutig ist. Vergessen Sie nicht, das #-Zeichen vor der ID hinzuzufügen.

2. Durch Klicken auf die Schaltfläche:
Wenn die Stelle, auf die wir klicken möchten, um zu springen, eine Schaltfläche ist, müssen wir, da die Schaltfläche kein href hinzufügen kann, den js-Sprungcode verwenden, um dies zu erreichen Code Ein Beispiel lautet wie folgt:

<script>
    function onTopClick() {
         window.location.hash = "#abc";
       }
    </script>
    <input  type="button" name="Submit" value="提交"  onclick="javascript:onTopClick();" />
    <div id="abc">js跳转到页面指定div位置</div>

Hinweis: Wie oben erwähnt, wird durch Klicken auf die Schaltfläche „Senden“ gescrollt und zum Div mit der ID="abc" auf derselben Seite gesprungen. Das Prinzip dieses js-Click-Jump-Seitencodes ist: Jedem Element der Seite wird eine eindeutige ID zugewiesen. Wenn Sie auf die Schaltfläche „Senden“ klicken, wird das js-Klickereignis ausgelöst, und js scrollt und springt über die ID window.location.hash zu dem Element = „#abc“ bezieht sich auf das Div, das auf der aktuellen Seiten-ID = „abc“ positioniert ist.

Die oben genannten sind zwei einfache Methoden zum Implementieren lokaler Sprungseiten in Divs. Ich glaube, dass selbst Anfänger das relevante Wissen leicht beherrschen werden, nachdem sie die Einführung in diesem Artikel gelesen haben.

Das obige ist der detaillierte Inhalt vonWie springe ich mit js zum angegebenen Div, nachdem ich auf einen bestimmten Teil der aktuellen Seite geklickt habe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!