Vor kurzem habe ich Papiere gemacht und war sehr geschickt. Ich habe das Web erneut entworfen und auf ein Problem gestoßen. In der Vergangenheit, als ich Webseiten entworfen habe, rannte ich in IE und habe nie Firefox angesehen, geschweige denn Chrom, aber jetzt ist es anders. Zumindest denke ich, dass Webseiten, die nicht mit Firefox kompatibel sind, äußerst hässlich und gefälscht sind. Aus diesem Konzept begann ich bei der Gestaltung der Seite auf diese Kompatibilität zu achten. Diesmal stieß ich auf ein Kompatibilitätsproblem. Es gibt ein schwimmendes Framework in der HTML, <Iframe>, die in die Seite eingebettet werden kann, die sehr geeignet ist, die Rahmenseite zu erstellen, wie in der folgenden Abbildung gezeigt.
Eine HTML -Seite ist in zwei Teile unterteilt, wobei die Navigationsleiste links und der Inhalt rechts angezeigt werden sollen. Der Code ist wie folgt:
Der Code in der linken Spalte lautet:
<Iframe Framborder = 0 id = frmtitleleft name = Frameleft src = links.html style = Höhe: 100%; Breite: 180px;>
Verbindung zu links herstellen.html
Die rechte Spalte ist ähnlich. Für die Seite, die ich gemacht habe, ist der Vorschau -Effekt wie folgt:
Welchen Effekt sollte jetzt erreicht werden, um einen praktischeren Effekt zu erzielen? Wenn Sie auf einen Link klicken, können Sie in der rechten Spalte angezeigt werden. Es ist offensichtlich, dass es über JS implementiert werden muss. Ich werde nicht viel über die ursprüngliche inkompatible Methode sagen. Bitte denken Sie an die folgenden Implementierungsschritte:
1. Holen Sie sich zuerst das Iframe -Objekt in der rechten Spalte
var var rames = document.getElementById (FrameID); // FrameID ist der ID -Name des Iframe in der rechten Spalte
2. Setzen Sie seinen SRC -Wert zurück
Frames.src = pageurl; // pageurl ist die Zielseite, die angezeigt werden soll
Dies ermöglicht den Seitensprung
Aber es gibt einen anderen Punkt, wenn Sie die Funktionen nennen möchten, ist es nicht so einfach
Beispielsweise gibt es in der rechten Spalte eine Funktion rechts (). Ich möchte die rechte () -Funktion in der Link in der linken Spalte aufrufen. Wie man es implementiert
1. Zunächst einmal ist der linke Rahmen in den Container -Seite index.html eingebettet.
var Frames = window.parent.window.document.getElementById (FrameID);
2. Um Funktionen auf seiner Seite ausführen zu können, müssen Sie das Fensterobjekt erhalten. Hier ist ein wichtiges Objekt, ContentWindow. Erhalten Sie dieses Objekt, und dann können Sie die darin darin enthaltenen Funktionen ausführen, z.
Frames.ContentWindow.right ();
Der obige Code ist mit IE6, Firefox3 und Chrome 2.0 kompatibel. Sie alle haben den Test erfolgreich bestanden. IE7 hat es nicht versucht, aber es sollte kein Problem sein.