Entry
How can I capture keypress events of frames to process them in the frameset ?
Apr 30th, 2000 07:38
Martin Honnen, Gustavo Kramer,
IE5 has some
attachEvent
function which allows the FRAMESET to attach its event handler to the
event sources of the FRAMEs. The problem is that the event object is
not transferred at all so that you got your event handler to fire
without any information about the event. Fortunately JScript with
try/catch allows to loop through the frames to find the right event
object so here is a code example for IE5 capturing key events in FRAMEs
from the FRAMESET document:
In contrast to IE NN4 allows a FRAMESET to capture events of the FRAMEs
easily:
<HTML>
<HEAD>
<SCRIPT>
if (document.layers)
window.captureEvents(Event.KEYPRESS);
function keyHandler (evt) {
alert(evt.type + ' with key ' + evt.which);
}
window.onkeypress = keyHandler
</SCRIPT>
</HEAD>
<FRAMESET ROWS="50%, 50%">
<FRAME NAME="frame0" SRC="whatever.html">
<FRAME NAME="frame1" SRC="whatelse.html">
</FRAMESET>
</HTML>
Note that the NN4 solution is much more powerful than the IE and NN6
solution as it continues to capture events for the FRAMEs even when new
documents are loaded into the frame.
NN6 doesn't support the captureEvents like NN4 but has a powerful
addEventListener
concept that allows to register event handlers for the frames from the
frameset (and contrary to IE there are no problems to access the event
object):
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function initEventHandling() {
for (var f = 0; f < frames.length; f++)
frames[f].document.addEventListener('keypress', keyHandler, true);
}
function keyHandler (evt) {
alert(evt.type + ' with key ' + (evt.which || evt.charCode ||
evt.keyCode));
}
</SCRIPT>
</HEAD>
<FRAMESET ONLOAD="initEventHandling()" ROWS="50%, 50%">
<FRAME NAME="frame0" SRC="whatever.html">
<FRAME NAME="frame1" SRC="whatelse.html">
</FRAMESET>
</HTML>
Here is an attempt to stuff all these different approaches into one
document:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
if (document.layers) {
window.captureEvents(Event.KEYPRESS);
window.onkeypress = function (evt) {
alert(evt.type + ' with key ' + evt.which);
}
}
function keyHandler (evt) {
alert(evt.type + ' with key ' + (evt.which || evt.charCode ||
evt.keyCode));
}
function initEventHandling() {
if (!document.all && !document.layers)
for (var f = 0; f < frames.length; f++)
frames[f].document.addEventListener('keypress', keyHandler, true);
}
</SCRIPT>
<SCRIPT LANGUAGE="JScript">
function initEventHandling () {
for (var f = 0; f < frames.length; f++)
frames[f].document.attachEvent('onkeypress', ieFrameChecker);
}
function ieFrameChecker () {
for (var f = 0; f < frames.length; f++) {
try {
var event = frames[f].event;
var type = frames[f].event.type;
event.frame = frames[f];
keyHandler(event);
}
catch (e) {
// ignore e as we are just looking for the
// frame which has a valid event object
}
}
}
function keyHandler (evt) {
alert(evt.type + ' in frame ' + evt.frame.name + ' with key ' +
evt.keyCode);
}
</SCRIPT>
</HEAD>
<FRAMESET ONLOAD="initEventHandling()" ROWS="50%, 50%">
<FRAME NAME="frame0" SRC="whatever.html">
<FRAME NAME="frame1" SRC="whatelse.html">
</FRAMESET>
</HTML>
