使用Jquery跟踪iframe内的点击

Track clicks inside iframe with Jquery

本文关键字:iframe Jquery 跟踪 使用      更新时间:2023-09-26

我试图找出一种方法跟踪点击与jquery内iframe。iframe位于同一域,但我似乎仍然无法使这项工作,这是我的代码:

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
    var clicks = 0;
    $('#myframe').load(function() {
        alert('loaded');
        var that = $(this);
        that.contents().find('a').bind('click', function(e) {
            e.preventDefault();
            clicks++;
            $('#clicks').html(clicks);
        });
    });
</script>
</head>
<body>
Clicks: <span id="clicks" >0</span>
<iframe id="myframe" src="test_iframe.php" width="500" height="500"></iframe>
</body>
</html>

你知道哪里出了问题吗?

我在SO看到过其他非常类似的问题,但没有一个答案能解决我的问题。

更新:

我已经更新了我的代码在http://www.politicos.biz/stack/iframe_click.php与@Wes代码,它适用于jsfiddle,但不是在我的网站。

在添加事件之前,请确保iframe完全加载。

我希望处理程序添加.document

$('body', window.parent.frames[0].document).click( 
    function(){} 
);

$('body', $('templateframe')[0].document).click( 
    function(){} 
);

下面是一个例子:

http://jsfiddle.net/wesbos/VxA8t/1/

$(function() {
    var clicks = 0;
    $('#myframe').contents().find('a').bind('click', function(e) {
        e.preventDefault();
        clicks++;
        $('#clicks').html(clicks);
    });
});

你需要先找到链接,然后绑定到它。

你的代码应该是这样的:

$('body', $('templateframe')).contents().find('a').click(function(event) {
  alert("Link Clicked");
});

在父框架上创建一个从iframe内部调用的函数。

父:

var click = 0;
function addClick()
{
    click++;
}

然后,从iframe

调用它
parent.addClick();

最后,简单参考click的点击计数数。