Question

我不太确定我做得对，我可能使用了错误的功能，但是：

<script>
    function go(loc){
        document.getElementById('iframe').src = loc;
    }
</script>

我想将登录详细信息容器中的iframe更改为通过单选按钮选择的任何页面（还有如何自动选择第一个单选按钮？）

<div class="logins_details_container"><!--The top container-->
    <iframe id="iframe" src="home_schedule_iframe.php" width="100%" height="100%"></iframe>
</div>  
<div class="iframe_container">
    <form>
        <input type="radio" name="iframe" value="type" onselect = "go('maths_iframe.php')"/>Maths<br>
        <input type="radio" name="iframe" value="type" onselect = "go('ict_iframe.php')"/>ICT
    </form>
</div>

Answer 1

尽管onClick。

，您只需要使用onSelect功能

所以代码就像这样

<强>的JavaScript

<script>
    function go(loc){
      console.log(loc);
        document.getElementById('iframe').src = loc; 
    }
</script>

<强> HTML

<div class="logins_details_container"><!--The top container-->
    <iframe id="iframe" src="home_schedule_iframe.php" width="100%" height="100%"></iframe>
</div>  
<div class="iframe_container">
    <form>
        <input type="radio" name="iframe" value="type" onClick= "go('maths_iframe.php')"/>Maths<br>
        <input type="radio" name="iframe" value="type" onClick = "go('ict_iframe.php')"/>ICT
    </form>
</div>

以下是Fiddle正在运行的代码（由于它们不在服务器上，因此无法加载maths_iframe.php和ict_iframe.php。

Answer 2

<script>
    function go(loc){
        alert(loc);
        document.getElementById('myframe').src = loc;
    }
</script>

<div class="logins_details_container"><!--The top container-->
    <iframe id="myframe" src="home_schedule_iframe.php" width="100%" height="100%"></iframe>
</div>  
<div class="iframe_container">
    <form>
        <input type="radio" name="iframe" value="type" onclick = "go('maths_iframe.php')"/>Maths<br>
        <input type="radio" name="iframe" value="type" onclick = "go('ict_iframe.php')"/>ICT
    </form>
</div>

fiddle

用于更改iFrame的单选按钮不起作用

2 个答案: