Js-Methode zur Realisierung von Webseiten-Tastatursteuerungs-Page-Turning_Javascript-Fähigkeiten-js-Tutorial-php.cn

Js-Methode zur Realisierung von Webseiten-Tastatursteuerungs-Page-Turning_Javascript-Fähigkeiten

WBOY

Freigeben： 2016-05-16 16:32:44

Original

1682 Leute haben es durchsucht

Das Beispiel in diesem Artikel beschreibt die Methode zur Verwendung von JS zur Steuerung des Seitenwechsels über die Tastatur auf einer Webseite. Teilen Sie es als Referenz mit allen. Die spezifische Implementierungsmethode lautet wie folgt:

Ich denke, wir sehen den tastaturgesteuerten Seitenwechseleffekt oft auf vielen Websites, insbesondere bei Fotoalben. Das Prinzip ist sehr einfach ob der Benutzer die Auf- oder Ab-Taste drückt.

Zum Beispiel:

Code kopieren Der Code lautet wie folgt:

Vorheriges Kapitel
Zurück zum Verzeichnis
Nächstes Kapitel

Der js-Code lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

Ich habe diese Funktion heute im Internet gesehen. Es ist gut, dass ich diese Funktion in Zukunft zum Artikel hinzufügen kann

Code kopieren Der Code lautet wie folgt:

var re = /[[(<]?Vorherige Seite[])>]?/igm;

if (window.document.body.innerHTML.search(re) >= 0) { 

var PREVIOUS_PAGE = RegExp.$1;
}

Wenn Sie nach „vorherige Seite“ suchen, definieren Sie

Code kopieren Der Code lautet wie folgt:var PREVIOUS_PAGE = RegExp. 1 $;

var re = /[[(<]?Nächste Seite[])>]?< a>/igm; if (window.document.body.innerHTML.search(re) >= 0) {

var NEXT_PAGE = RegExp.$1;
}


Wenn Sie nach „nächste Seite“ suchen, definieren Sie 

Code kopieren

Der Code lautet wie folgt: var NEXT_PAGE = RegExp. 1 $; if (typeof PREVIOUS_PAGE == "string" || typeof NEXT_PAGE == "string") { document.onkeydown = function() {

switch (event.srcElement.tagName) {

Fall „INPUT“: 

Fall „TEXTAREA“: 

Fall „SELECT“: 

Pause; 

Standard: 

if (event.keyCode == 37 /* Pfeil nach links*/ && typeof PREVIOUS_PAGE == "string") { 

window.location.href = PREVIOUS_PAGE; 

} 

else if (event.keyCode == 39 /* Arrow Right */ && typeof NEXT_PAGE == "string") { 

window.location.href = NEXT_PAGE;
} 

} 

} 

}

Lassen Sie mich über eine Tastenkombinationsimplementierung zum Auf- und Abblättern sprechen, die ich erstellt habe. Wenn der Benutzer auf die linke und rechte Pfeiltaste klickt, ruft js den Tastaturcode ab und springt dann zur nächsten oder vorherigen Seite. Heutzutage stammen viele Codes im Internet aus dem IE und können unter Firefox oft nicht ausgeführt werden Unterstützt nicht den Standard. Aufgrund von **.click() wird der Klickvorgang für das A-Tag unter IE standardmäßig zur entsprechenden URL umgeleitet, dies ist jedoch unter FF nicht möglich (onClick() ist in Ordnung, aber das ist es das onClick-Ereignis von A ausgeführt). 

Die Lösung ist auch sehr einfach. Wir können diese Methode verwenden: Erfassen Sie, wann der Benutzer auf die rechte Pfeiltaste klickt, und weisen Sie das href-Attribut von A auf der nächsten Seite window.location.href zu.

Code kopieren

Der Code lautet wie folgt:

var $=function(id)

{

Gibt document.getElementById(id);
 zurück
}

var hotKey=function(e) 

{

var e =e||event;

var k = e.keyCode||e.which||e.charCode;//Holen Sie sich den Schlüsselcode

Wenn (k == 37)

{

          if ($("prevPage"))

               window.location.href = $("prevPage").href;

}

sonst wenn (k == 39)

{

           if ($("nextPage"))

                window.location.href = $("nextPage").href;

}

sonst wenn (k == 72)

{

          if ($("home"))

               window.location.href = $("home").href;

}

}

document.onkeydown = hotKey; //Linke und rechte Taste

Ich hoffe, dass dieser Artikel für alle bei der Webprogrammierung auf Basis von JavaScript hilfreich sein wird.