使用单选按钮从href target =“_ blank”更改为iframe

时间:2012-10-08 07:07:05

标签: javascript html

我想创建一个包含链接列表的页面(或按钮或图片无关紧要),这样当用户点击按钮/链接时,根据无线电选择,链接将在iframe在同一页面上或打开一个target =“_ blank”的新窗口。有可能吗?

我想也许可以使用这样的表格:

<html>    
 <head><title>Rec. Links</title></head>     
<body>    
<form method="get" action="?">         
<imput type="radio" value="new" name="group1"/>    
<input type="radio" value="iframe"name="group1"/>    
</form>    
<a href="..."/>    
<a href="..."/>    
<a href="..."/>    
...    
<a href="..."/>    
</body>    
</html>

但我可以在哪里发送选择?我可以将它发送到同一页面吗?

2 个答案:

答案 0 :(得分:1)

您必须在每个单选按钮上添加一个点击处理程序,例如

... onclick="updateTargets('iframe');" />
... onclick="updateTargets('_blank');" />

创建一个可以改变每个锚的目标的函数:

function updateTargets(newTarget)
{
    var anchors = document.getElementsByTagName('a');

    for (var i = 0, item; item = anchors[i]; ++i) {
        item.target = newTarget;
    }
}

答案 1 :(得分:0)

使用类似这样的jQuery可能会让你失望 - 基本上你绑定到无线电组更改事件,然后根据所选的值更改锚点的所有目标属性。

<script type="text/javascript">

jQuery(document).ready(function($) {

$('input:radio[name=group1]').change(function() {
        var value = $(this).val();
        if(value == "iframe") {
                $('a').attr('target', '');
        } else {
                $('a').attr('target', '_blank');
        }
});
});
</script>
</head>
<body>

<form method="get" action="?">
<input type="radio" value="new" name="group1" />
<input type="radio" value="iframe"name="group1"/>
</form>
<a href="http://www.google.com">Jello</a>
</body>
</html>