事件处理程序在 HTML 源代码中内联分配('onclick="..."')
。该 HTML 源代码在 iframe 中接收并移动到显示的页面(document.getElementById("...").appendChild(iframenodesnewhtmlsource)).
事件处理程序执行form submit (document.getElementById("form1").submit())
. 表单被提交到从上面接收到新的 HTML 源的 iframe。"action="
表单的页面通过发送一个parent.func()
在其 JavaScript 中执行的 HTML 页面来响应。这些parent.func()
是显示页面中与事件处理程序相同范围内的函数并被执行: 表单提交后仍会执行隐式 JavaScript。
再次对应该调用事件处理程序的事件处理程序元素执行操作不会调用事件处理程序:在表单提交后不调用显式 JavaScript 事件处理程序。
IE 中的命名冲突导致了与类似代码相同的问题:IE 不喜欢“form”之类的表单名称或与函数具有相同名称的 id 或类似的名称。如果您对原始问题没有解决方案,请写下 IE 的 HTML 元素命名和 JavaScript 命名(如果您知道的话)。
HTML5,Internet Explorer 8 标准模式。
代码如下。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title></title>
<style type="text/css">
</style>
<script type="text/javascript">
function callback(data,type)
{
if(type == 0)
{
if(document.getElementById("tablediv").firstChild != null)
{
document.getElementById("tablediv").removeChild(document.getElementById("tablediv").firstChild);
}
document.getElementById("tablediv").appendChild(data.firstChild);
}
}
function load(tablesrc)
{
document.getElementById("changedfield").value = "table";
document.getElementById("showntable").value = tablesrc + "";
document.getElementById("form1").submit();
}
function savevalue(src,node)
{
document.getElementById("changedfield").value = src.id;
document.getElementById("changedvalue").value = src.value;
document.getElementById("form1").submit();
}
function init()
{
document.getElementById("form1").setAttribute("action","/cgi-bin"+window.location.pathname.substring(0,window.location.pathname.lastIndexOf("/"))+"/../../gettable.cgi");
load(1);
}
</script>
</head>
<body onload="javascript:init()">
<div id="tables">
<form id="form0" name="form0">
<div id="tableselect">
<input type="button" value="" onclick="javascript:load(1)" />
<input type="button" value="" onclick="javascript:load(2)" />
<input type="button" value="" onclick="javascript:load(3)" />
<input type="button" value="" onclick="javascript:load(4)" />
<input type="button" value="" onclick="javascript:load(5)" />
<input type="button" value="" onclick="javascript:load(6)" />
</div>
<div id="tablediv"></div>
</form>
<form id="form1" name="form1" target="iframe1" method="post" action="">
<input type="hidden" id="showntable" name="showntable" value="" />
<input type="hidden" id="changedfield" name="changedfield" value="" />
<input type="hidden" id="changedvalue" name="changedvalue" value="" />
</form>
<iframe id="iframe1" name="iframe1"></iframe>
</div>
</body>
</html>