事件处理程序在HTML源('onclick="..."')
中内联分配。该HTML源在iframe中接收并移至显示的页面(document.getElementById("...").appendChild(iframenodesnewhtmlsource)).
事件处理程序执行form submit (document.getElementById("form1").submit())
。表单将提交给iframe,收到上面的新HTML源代码。表单的"action="
页面通过发送一个在其JavaScript中执行parent.func()
的HTML页面来响应。这些parent.func()
是显示页面中与事件处理程序在同一范围内的函数,并且执行:在表单提交后仍然执行隐式JavaScript。
再次对事件处理程序元素执行应该调用事件处理程序的操作不会调用事件处理程序:在表单提交后不会调用显式JavaScript事件处理程序。
IE中的命名冲突导致了类似代码的相同问题:IE不喜欢像“form”这样的表单名称或与函数同名或类似名称的id。如果你没有原始问题的解决方案,请写一下IEs的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>