我在网页上有 2 个框架,左框架填充了来自 javascript 对象的国家名称列表。每个国家也是主要对象中的一个对象,并具有 4 个名称/值属性。我正在使用附加到正文 onload 的以下功能:
function populateList() {
var list = top.frames[0].document;
list.open()
list.write("<h2>Countries</h2><ul>");
for ( name in euMem ){
if( typeof name !== 'object' ){
list.write( '<li><a href=\"\" onclick=\"updateFrame(\'' + name + '\');\">' + name + '</a></li>' );
}
}
list.write("</ul>");
list.close();
}
当用户单击左侧的国家名称之一时,它旨在运行此功能:
function updateFrame( country ) {
var infoFrame = top.frames[1].document;
infoFrame.open();
var size = Object.size(euMem[country]);
infoFrame.writeln("<h1>Information for " + country + "</h1>");
for( prop in euMem[country] ){
infoFrame.writeln(prop + " : " + euMem[country][prop] + "<br>" );
}
infoFrame.close();
}
这似乎在 Chrome 上运行良好,但在 Firefox 上我收到参考错误,指出未定义 updateFrame。当我将 updateFrame 直接硬编码到 HTML 中时,它可以在 firefox 上顺利运行,但是当它使用 document.write 编写时,我得到了参考错误。
为什么这在 Firefox 上不起作用?
编辑: 这是我写的一个快速脚本来测试这个最基本的版本:
<html>
<head>
<title>InfoPane</title>
<script type="text/javascript">
function test(name){
alert(name);
}
function load(){
document.write("<button onclick='test('John Doe');'>Alert Me!</button>");
}
</script>
</head>
<body onload="load();">
</body>
</html>
以上不适用于火狐...
我能够让这段代码作为一个基本示例工作,但无法将其扩展为我上面的代码以使其发挥作用:
<html>
<head>
<title>InfoPane</title>
<script type="text/javascript">
function test(){
alert(this.name);
}
function load(){
var btn = document.createElement('button');
btn.name = 'John Doe';
btn.onclick = test;
btn.innerHTML = 'Alert Me!';
document.body.appendChild(btn);
}
</script>
</head>
<body onload="load();">
</body>
</html>