在移动浏览器中,JQuery点击事件不适用于iframe

这是我遇到的一个非常具体的问题,但是我没有关于如何调试这个问题的想法,或者甚至发现它是否适用于移动浏览器.

我有2个页面(都在SAME域上,因此我没有跨域安全策略的问题),一个在另一个内部的iframe中.由于我需要捕获父项和子项的点击,我创建了一个覆盖iframe的div,然后调用子元素上的click方法：

这是我制作的演示代码：

父文件：

<script>
$(document).ready(function()
{
    $("#floating_play_button").click(function()
    {
        alert("just clicked floating_play_button... will try to click iframe's on click for link2");
        $('#slider').contents().find("#link1").click();
    });
});
</script>

<div id="floating_play_button" style="cursor:pointer; left: 0px; top:0px; width:100%; height:395px; position:absolute; border:2px solid red;"></div>
<iframe id="slider" src="slider_test.php" width="957" height="337" frameBorder="1" style="border:2px solid green;" ></iframe>

子页面：

<script>
$(document).ready(function()
{
    $("#link1").click(function()
    {
        alert("#link1 clicked...");
    });
});
</script>

<div id="link1">
    <a href="#">Link 1</a><br />
</div>

这适用于所有桌面浏览器,但不适用于Chrome for Android(2013年7月22日版本)默认的Android浏览器,iPad和iPhone.

在子页面中,我尝试了这两种形式,但都没有工作：

$(document).on('click', '#link1', function()
    {
        alert("on click activated for link1");
    });

    $("#link1").click(function()
    {
        alert("#link1 clicked...");
    });

作为补充说明,选择器很好.我可以做一些事情,比如通过jQuery更改文本属性和类似的东西,它工作正常.我只是无法调用click事件.

任何提示或指示？

谢谢！

Chrome不允许访问iframe的内容.即使内容具有相同的来源.

您应该使用postMessage在帧之间进行通信.

也许这有助于：
cross-window-messaging-with-postmessage