iframe内内容的jQuery函数[重复]
Posted
技术标签:
【中文标题】iframe内内容的jQuery函数[重复]【英文标题】：jQuery functions for content inside the iframe [duplicate] 【发布时间】：2015-07-09 21:11:04 【问题描述】：我有以下带有 iframe 的 html 代码：
<body>
<a href="#">example 1</a>
<div style="width:150px;">example 2</div>
<br><br>
<iframe align="center" src="test.html" frameborder="yes" scrolling="yes" name="myIframe" id="myIframe"> </iframe>
</body>
test.html
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>TODO write content</div>
<br>
<div>div content</div>
</body>
</html>
然后我写了一个jQuery代码来查找div标签并突出显示
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script lang="text/javascript">
$(document).ready(function()
var iframe = $('#myIframe');
iframe.load(function()
iframe.ready(function()
$(document).on('mouseover', 'div', function (e)
$(this).addClass('highlight');
);
$(document).on('mouseout', 'div', function (e)
$(this).removeClass('highlight');
);
); // end iframe load
);// end iframe ready
);
</script>
这在 iframe 之外的 div 中有效。我需要突出显示 iframe 内部的 div。
【问题讨论】：
【参考方案1】：您可以将悬停功能压缩成一个简洁的功能：
$(document).on('mouseover mouseout', 'div', function ()
$(this).toggleClass('highlight');
);
https://jsfiddle.net/Panomosh/m5yaaygk/
【讨论】：
以上是关于iframe内内容的jQuery函数[重复]的主要内容，如果未能解决你的问题，请参考以下文章