Question

I have this situation:

<a href="http://www.google.ru" target="_blank">
      <iframe frameborder="0" style="background-color: transparent;" allowtransparency="true" scrolling="no" width="300px" height="200px;>
        <html>
        <head></head>
        <body>
          <img height="131" width="300" src="http://blog.stackoverflow.com/wp-content/uploads/stackoverflow-logo-alt2-300.png" alt="" />
        </body>
        </html>
      </iframe>
    </a>

<A> tag including <iframe>. The problem is that the link doesn't work: you can click it, but nothing's going on. How can I fix it? Browser: FF38, Chrome42

Answer 1

正如已经评论过的，这是无效的HTML。您可以通过使用div或display: block锚点覆盖iframe来完成相同的操作，或者在这种情况下，只需删除iframe并单独使用图像。

如果你的html是：

<iframe id="if-id" src="something">
    <!--stuff-->
</iframe>
<a id="a-id" href="somewhere.com"></a>

然后你的CSS可能是：

#if-id {
    position: absolute;
    top: 100px;
    left: 100px;
    height: 100px;
    width: 100px;
    z-index: 1; /* for clarity */
}

#a-id {
    position: absolute;
    display: block; /* so anchor can take dimensions */
    top: 100px;
    left: 100px;
    height: 100px;
    width: 100px;
    z-index: 2;
}

Answer 2

iframe在当前窗口内实例化一个新窗口。我认为不可能在内部内容上设置监听器，因此它将被广播给父母一个!!

Answer 3

您可以向iframe添加侦听器，并在单击框架时打开链接

我建议：

$('#iframeid').click(function() {
    window.location.href = 'http://www.google.ru'
});

<a href=""> including <iframe> does not work

3 个答案: