1

如何在 iframe 中获取鼠标悬停的元素？以下代码适用于 HTML 页面，但不适用于 iframe 中的 html>

<head>
    <script type="text/javacsript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        $(document).ready(function ({
            $('body').mousemove(function (e) {
                var details = e.target.id;
                console.log(details);
            });
         });
    </script>
</head>

<body>
    <div id="one"></div>
    <div id="two"></div>
    <div id="three"></div>
    <div id="four"></div>
    <iframe src="http://www.w3schools.com" width="800" height="800" id="five"></iframe>
</body>

4

1 回答 1

2

您必须将该代码设置到您在iframe. 那是因为您正在将另一个网页显示到iframe. 然后，您的主页和您iframe拥有自己的 CSS、JS 等。如果您不想将该代码添加到加载到的网页中，iframe则必须使用以下方式访问它：

//THIS IS AN EXAMPLE
$("#iFrame").contents().find("#someDiv").removeClass("hidden");

对于你的例子，我建议使用这个：

<script type="text/javacsript" src="http://ajax.googleapis.com/ajax/libs/jquery/
    1.9.1/jquery.min.js"></script>

<script> //YOU FORGOT TO ADD THIS OPENING SCRIPT TAG
    $(document).ready(function({
        // THIS SHOULD WORK FOR YOUR MAIN PAGE
        $('body').mousemove(function (e) {
            var details = e.target.id;
            console.log(details);
        });
        // THIS SHOULD WORK FOR YOUR IFRAME
        $("#iFrame").contents().find.('body').mousemove(function (e) {
            var details = e.target.id;
            console.log(details);
        });
    });
</script>

参考：访问 iframe

希望能帮助到你。

于 2013-05-27T14:04:29.020 回答