从该线程Selecting an element in iFrame jQuery的引用来看,我认为我在iframe .toolbar
中选择类#iframe_toolbar
的方法正确,但是它根本没有选择任何元素。
strict_toolbar_top.html
$(document).ready(function(){
console.log($('#iframe_toolbar').contents().find('ul.toolbar'));
$(document).on('scroll',function(){
var top = $(window).scrollTop();
$('#iframe_toolbar').contents().find('ul.toolbar').css({
'margin-top':top,
})
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="height: 900px;">
<iframe id='iframe_toolbar' src="toolbar.html" frameborder="0" width="100%" height="800px"></iframe>
</div>
toolbar.html
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
<ul class="toolbar" style="position: fixed;width:100%;">
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li style="float:right"><a class="active" href="#about">About</a></li>
</ul>
<div class="content" style="height: 30px;">
</div>
console.log($('#iframe_toolbar').contents().find('ul.toolbar'));
返回一个空对象,如下所示:
我的jquery脚本出了什么问题?