使用另一个网页中的按钮更改一个网页中的div

问题描述 投票:0回答:1

我有2个网页:一个像电视,另一个像遥控器。

这是电视

<!DOCTYPE html>
<html>
    <head>
        <title>Welcome to RemoteDemo</title>
    </head>
<body>
    <div id="Tvspace">
        <iframe width="560" height="315" src="SomeRandomYoutubeURL" frameborder="0"  allowfullscreen></iframe>      
    </div>
</body>
</html>

这是遥控器:

<!DOCTYPE html>
<html>
<head>
    <title>Remote</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="script.js"></script>
</head>
<body>
    <!--Click this to go on the next channel -->
    <button id = "next"> Next </button>
</body>
</html>

每当我点击下一个/上一个按钮时,我想要另一个iframe加载div名称“Tvspace”而不是原始。

我尝试了这个,但它正在打开一个新的页面

$("#next").on('click', function(){
     window.location = "http://www.google.com/";    
});

我希望它在不刷新或创建新页面的情况下加载内容。谢谢。

javascript jquery html ajax
1个回答
1
投票

w3schools,他们说:

window.location对象可用于获取当前页面地址(URL)并将浏览器重定向到新页面。

因此,您无法使用窗口位置来加载iframe。您可以使用它来获取页面的网址,将其设置为重定向到另一个页面。

如果你检查这个link,你可以找到一种方法来加载你的iframe与另一个网址:

$("#next").on('click', function(){
    $("#Tvspace iframe").attr("src", "http://www.google.com/");
});
© www.soinside.com 2019 - 2024. All rights reserved.