创建了两个简单的html文件test.html和frame.html,在这里我在test.html中加载frame.html。但是在test.html中调用frame.html的函数不起作用,其给出的函数未定义
test.html
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body>
<h3 align="center">TEST AB TEST</h3>
<div id="load_frame" ></div>
<div style='padding:30px;background-color:red; '>
<input id="test_Button" type='button' value='test_Button'/>
</div>
<script>
$(function(){
$('#load_frame').append('<object data="frame.html"/>');
});
$("#test_Button").bind( "click",function(){
console.log('aaaaaaaa');
myFunction1();
});
</script>
</body>
</html>
frame.html
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body>
<h3 align="center">TEST Frame</h3>
<div style='padding:30px;width:500px;'>
<input id="frame_button" type='button' value='frame_button'/>
</div>
<script>
function myFunction1() {
alert('Inside frame');
}
$("#frame_button").bind( "click",function(){
myFunction1();
console.log('aaaaaaaa');
});
</script>
</body>
</html>
错误
Uncaught ReferenceError: myFunction1 is not defined
最佳答案
您需要在框架窗口的上下文中调用该函数
$("#test_Button").bind( "click",function(){
//reference to the frame window
var frameWindow =$('#load_frame object')[0].contentWindow;
// the function is a property of that window
frameWindow.myFunction1();
});
关于javascript - 单击附加的外部内容不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51153609/