我想将一个点击事件添加到iframe. 我使用了这个例子并得到了这个：
$(document).ready(function () {
$('#left').bind('click', function(event) { alert('test'); });
});
<iframe src="left.html" id="left">
</iframe>
但不幸的是什么也没有发生。
当我用另一个元素（例如按钮）测试它时，它可以工作：
<input type="button" id="left" value="test">
您可以将点击附加到 iframe 内容：
$('iframe').load(function(){
$(this).contents().find("body").on('click', function(event) { alert('test'); });
});
注意：这仅在两个页面位于同一域中时才有效。
现场演示：http : //jsfiddle.net/4HQc4/
两种解决方案：
:after一对.iframeWrapper元素pointer-events:none;一个 iframe:after很直接。iframe 包装器有一个:after具有更高 z-index的（透明）伪元素- 这将有助于包装器注册点击：
jQuery(function ($) { // DOM ready
$('.iframeWrapper').on('click', function(e) {
e.preventDefault();
alert('test');
});
});.iframeWrapper{
display:inline-block;
position:relative;
}
.iframeWrapper:after{ /* I have higher Z-index so I can catch the click! Yey */
content:"";
position:absolute;
z-index:1;
width:100%;
height:100%;
left:0;
top:0;
}
.iframeWrapper iframe{
vertical-align:top;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="iframeWrapper">
<iframe src="http://www.reuters.tv/" frameBorder="0"></iframe>
</div>pointer-events:none;无法从外部资源的 iframe外部处理点击（如果 iframe 不在您的域中）。
您只能在“调用到 iframe”页面中创建该函数，而不能从iframe 托管页面中创建。
怎么做：
iframe成一个 diviframe使用的 CSSpointer-events:none;jQuery您的包装DIV（iframe父元素）jQuery(function ($) { // DOM ready
$('.iframeWrapper').on('click', function(e) {
e.preventDefault();
alert('test');
});
});.iframeWrapper{
display:inline-block;
position:relative;
}
.iframeWrapper iframe{
vertical-align:top;
pointer-events: none; /* let any clicks go trough me */
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="iframeWrapper">
<iframe src="http://www.reuters.tv/" frameBorder="0"></iframe>
</div>诺塔贝内：
pointer-events：\我让它工作，但只有在将它上传到主机之后。我想 localhost 也能正常工作。
外
<html>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function() {
var myFrame = document.getElementById("myFrame");
$(myFrame.contentWindow.document).find("div").on("click", function () { alert("clicked"); });
});
</script>
<body>
<iframe id="myFrame" src="inner.htm"></iframe>
</body>
</html>
内
<html>
<head>
<style>
div {
padding:2px;
border:1px solid black;
display:inline-block;
}
</style>
</head>
<body>
<div>Click Me</div>
</body>
</html>
$(document).ready(function () {
$('#left').click(function(event) { alert('test'); });
});
<iframe src="left.html" id="left">Your Browser Does Not Support iframes</iframe>
该脚本必须完全从 iframe 运行。我会推荐一种不同的调用内容的方法，例如 php。
iframe 真的不值得麻烦。
实际问题是，click事件没有绑定到iframe的DOM，bind()被弃用，用于.on()绑定事件。尝试使用以下代码，您会发现 iframe 的边框可点击以获取该警报。
$('#left').on('click', function(event) { alert('test'); });
那么如何完成呢？
你应该怎么做，在 iframe 页面上创建一个函数，然后从该 iframe 页面调用该函数。