最近发现一个网页程序的Bug, 我的 主页面引用了一个 IFrame, 而IFrame里面有 Frameset 的两个Frame. 主页面是有滚动条的, 但是在 FrameSet 的 frame获得焦点时, 无法将键盘(上,下键)或者鼠标中键消息传递给 主页面, 导致无法操作滚动条.
在网络上找了半天,都没有找到解决办法, 最后还是自已动手, 解决了这个问题.
处理方式是:
1: 针对frameset 中的每个frame注册键盘和鼠标中键的事件.
2: 在事件中, 强行对外层页面进行滚动操作.
相关代码是:
//注册滚动事件
function registerScroll() {
try {
//需要滚动的窗体,对于我的应用,固定为以下窗体
//如果针对其它门户,需要进行修改或改为参数传递
var scrollWindows = top.frames(0);
for(var i = 0; i < frames.length; i++) {
var h = new ScrollHandle(i,scrollWindows);
frames[i].document.attachEvent("onkeydown",h.keyDownhandle);
frames[i].document.attachEvent("onmousewheel",h.wheelHandle);
}
}catch(err){}
}
/**
* 强制滚动指定的窗体
*/
function ScrollHandle(index,scrollWindows) {
this.keyDownhandle = function()
{
try {
var keyCode = frames[index].event.keyCode;
if (keyCode == 40) //下键
scrollWindows.document.body.doScroll("scrollbarDown");
else if(keyCode == 38) //上键
scrollWindows.document.body.doScroll("scrollbarUp");
else if(keyCode == 37) //左键
scrollWindows.document.body.doScroll("scrollbarLeft");
else if(keyCode == 39) //右键
scrollWindows.document.body.doScroll("scrollbarRight");
//else 其它键暂时不做处理
} catch (err){}
}
this.wheelHandle = function()
{
try {
var wheelDelta = frames[index].event.wheelDelta;
if (wheelDelta >= 120) //上滚
scrollWindows.document.body.doScroll("scrollbarUp");
else if (wheelDelta <= -120) //下滚
scrollWindows.document.body.doScroll("scrollbarDown");
} catch (err) {}
}
}