Question

我想在点击按钮时切换iframe的来源。我尝试过的东西不起作用。

<input type="image" id="pluto" src="pluto.jpg" alt="pluto" width="150px" height="150px" style="margin-left: 45%;" onclick="function()"/>

<script>
    document.getElementById('pluto').onclick = function() {
    {
        var property = document.getElementById(iframe);
        if (document.getElementById("something").src = "http://www.w3schools.com/";) {
            document.getElementById("something").src = "http://agar.io/";    
        }
        else {
            document.getElementById("something").src = "http://www.w3schools.com/";
        }
    }
</script>
<iframe id='something' name="main" src="http://www.w3schools.com" style="border:none;width:100%;height:100%;margin-top:150px;"></iframe>

请帮帮我。

Answer 1

您的代码应该是，请参阅JavaScript comparison operator：

if (document.getElementById("something").src == "http://www.w3schools.com/") {...}

Answer 2

这里有多个语法和语义问题。首先，您需要将您正在使用的所有元素放入DOM中，以便脚本标记出现。选择iframe时，您要使用其ID，而不是标签名称。也可以使用您定义的变量，而不是反复搜索元素。然后你的比较是一个任务 - 单和双方程符号产生巨大的差异。最后，你的病情应该更多

/mycontroller/myaction/param1/param2

表示文字：如果网址为A，则切换到B;否则（读取网址为B）切换到A.

这给我们留下了这样的代码：

if A then B
else A

这里有一个使用jQuery和数据属性的更短更智能的版本。它基本上将替代URL保存在属性中，并在按下按钮时切换它们。

<input type="image" id="pluto" src="pluto.jpg" alt="pluto" width="150px" height="150px" style="margin-left: 45%;"/>

<iframe id='something' name="main" src="http://www.w3schools.com" style="border:none;width:100%;height:100%;margin-top:150px;"></iframe>

<script>
document.getElementById('pluto').onclick = function() {
{
    var iframe = document.getElementById("something");
    if (iframe.src == "http://www.w3schools.com/") {
        iframe.src = "http://agar.io/";    
    }
    else {
        iframe.src = "http://www.w3schools.com/"
    }
}
</script>

在iframe源之间切换Javascript按钮

2 个答案: