Question

我想禁用IFRAME中的所有链接，当人们点击这些链接时，会弹出警报。

这是我到目前为止所做的，但jQuery什么也没做。不确定我做错了什么。

<iframe id='templateframe' name='templateframe' src="templates/template<?php echo $templateID; ?>/login.html"></iframe>

$(document).ready(function(){       
        $('#templateframe').contents().find('a').click(function(event) {
            alert("demo only");

            event.preventDefault();

        }); 
});

提前致谢。

Answer 1

我希望在加载iframe的内容之前执行$(document).ready。请尝试使用iframe的onload属性。

Answer 2

我也希望禁用iframe链接，但无法找到解决方案。感谢HTML5，您只需添加sandbox属性即可轻松停用链接。

<iframe src="externalsite.com" sandbox></iframe>

view demo

我希望这有助于有人在网上搜索，特别是因为这些问题首先出现在Google上。

Answer 3

“lol”提到的解决方案实际上效果很好。经过几个小时的工作后，我偶然发现了这个......

将你的iframe放在div元素中，然后使div透明，并将iframe的z-index推到div后面。见这个例子：

<div class="container">
  <iframe class="lockframe" src="www.google.com"></iframe>
</div>

然后像这样设置你的CSS：

div.container { background: transparent; }
div.lockframe { z-index: -2; }

加载您的网页，div将接受点击事件，而不是iframe。

Answer 4

的传奇故事

http://www.webdeveloper.com/forum/showthread.php?182260-Can-we-disable-links-inside-iframes

从过去的好时光中恢复了一项技术，当我们没有像-webkit-gradient()这样的电话时，我们已经恢复了这项技术。

只需在上面放一个透明的div！

Answer 5

否则你可以将脚本放在iframe中，从而缩短代码。它让我觉得它更轻松。

$(document).ready(function(){       
    $('a').click(function(event) {
        alert("demo only");
        event.preventDefault();
    }); 
});

Answer 6

除非您在本地加载内容，否则上述答案都不会起作用，因为当window.load事件触发时，iframe通常尚未加载。您可以向iframe添加一个侦听器，以查找iframe中的所有内容并禁用它们。

$("iframe").load(function() {
    $("iframe").contents().find("a").each(function(index) {
        $(this).on("click", function(event) {
            event.preventDefault();
            event.stopPropagation();
        });
    });
});

Answer 7

这是您的问题的通用解决方案。希望这会很好。

$(window).load(function(){
    $('#templateframe').contents().find('a').click(function(event) {
        alert("demo only");
        event.preventDefault();
    }); 
});

Answer 8

我认为如果你没有在源服务器上设置Access-Control-Allow-Origin，那么所提出的解决方案（除了html5沙箱）都不会起作用。要解决这个问题，在某些情况下，可以使用代理服务器，在另一台服务器上检索页面内容，解析html代码，删除链接，并将结果返回给客户端的浏览器。

Answer 9

作为防止默认的替代方法，您可以将锚点更改为跨度，以便链接不再链接更加明显。

$('#templateframe').contents().find('a').each(function() {
    $(this).replaceWith($('<span>' + this.innerHTML + '</span>'));
});

使用jQuery禁用IFRAME中的所有链接

9 个答案: