在多個代碼中更改iframe源。 javascript功能不起作用
[英]Changing iframe source within multiple tags. javascript function isn't working
問題描述
我正在嘗試執行一個javascript函數，該函數將更改每個iframe的源代碼。 如果iframe不在任何其他代碼中，則可以使用。
<!DOCTYPE html>
<html>
<head>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<button onclick="myFunction()">Search</button>
<iframe src="https://www.espn.com" frameborder="1" width="500" height="320"></iframe>
<iframe src="https://www.nbc.com" frameborder="1" width="500" height="320"></iframe>
<iframe src="https://www.cnn.com" frameborder="1" width="500" height="320"></iframe>
<script type = "text/javascript">
function myFunction(){
alert("Hello!");
var frames = window.frames;
for (var i = 0; i < frames.length; i++){
frames[i].location = "http://www.w3schools.com";
}
}
</script>
</body>
</html>
如果由於某種原因我將iframe放入div標簽中，javascript卻無法到達它們。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
<form align = "center">
<br>
<button onclick="myFunction()">Search</button>
<br>
</form>
<div class="col-xs-8 col-lg-6">
<h3 id = "ESPN">ESPN</h3>
<iframe src="https://www.espn.com" frameborder="1" width="500" height="320"></iframe>
<br>
</div>
<div class="col-xs-8 col-lg-6">
<h3 id = "NBC">NBC</h3>
<iframe src="https://www.nbc.com" frameborder="1" width="500" height="320"></iframe>
<br>
</div>
<div class="col-xs-8 col-lg-6">
<h3 id = "CNN">CNN</h3>
<iframe src="https://www.cnn.com" frameborder="1" width="500" height="320"></iframe>
<br>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type = "text/javascript">
function myFunction(){
alert("Hello!");
var frames = window.frames;
for (var i = 0; i < frames.length; i++){
frames[i].location = "http://www.w3schools.com";
}
}
</script>
</body>
</html>
為了讓我的函數讀取iframe，我還需要做些其他事情嗎？
4 個解決方案
解決方案1
2 已采納 2015-02-23 17:06:01
function myFunction(){
alert("Hello!");
var frames = window.getElementsByTagName("iframe"); // You only want iframes
for (var i = 0; i < frames.length; i++){
frames[i].src = "http://www.w3schools.com";
}
}
解決方案2
1 2015-02-23 17:05:23
var frames = window.querySelectorAll("iframe");
獲取所有iframe。 我不確定，但是您也可以將行更改為
frames[i].src = "http://www.w3schools.com";
解決方案3
0 2015-02-23 17:06:29
嘗試這個
frames[i].src= "http://www.w3schools.com";
對此感興趣
frames[i].location = "http://www.w3schools.com";
解決方案4
0 2015-02-23 17:13:18
您需要將JavaScript替換為以下內容：
function myFunction() {
alert("Hello!");
var frames = document.getElementsByTagName("iframe");
for (var i = 0; i < frames.length; i++) {
frames[i].src = "http://www.w3schools.com";
}
}
Javascript多功能無法正常工作
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.