Ich habe eine Webseite mit zwei iframes: iframe.main und iframe.secondary. Ich habe mich gefragt, ob es eine Möglichkeit gibt, eine bestimmte Seite in iframe.secondary zu laden, während die Seite in iframe.main geladen wird. Ich versuche zu veranschaulichen, was ich erreichen möchte:
<body>
<iframe id="main" src="">
</iframe>
<iframe id="secondary" src="">
</iframe>
<button onClick="main.location.href="mainpage.html"">
Load mainpage.html to iframe.main and secondary.html to iframe.secondary
</button>
</body>
Wie lade ich also sekundär.html in iframe.secondary, während mainpage.html in iframe.main geladen wird? Kann ich dies mit dem onClick-Ereignis oder dem onLoad-Ereignis der Schaltfläche tun?
Antworten:
0 für die Antwort № 1Ändern / einstellen src Attribut der beiden Iframes beim Klicken auf die Schaltfläche. Hier ist ein Beispiel, das auch Ihren HTML-Code schlanker macht:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Two iframes</title>
<script type="text/javascript">
window.onload = function(){
// Get the button that will trigger the action
var b = document.getElementById("trigger");
// and set the onclick handler here instead of in HTML
b.onclick = doLoads;
// The callback function for the onclick handler above
function doLoads() {
// Get the two iframes
var m = document.getElementById("main");
var s = document.getElementById("secondary");
// and set the source URLs
m.src = "mainpage.html";
s.src = "secondary.html";
}
// You could also move doLoads() code into an anonymous function like this:
// b.onclick = function () { var m = ... etc. }
}
</script>
</head>
<body>
<iframe id="main" src=""></iframe>
<iframe id="secondary" src=""></iframe>
<br>
<button id="trigger">Load both pages</button>
</body>
</html>