Forum Moderators: open
The following code disables the two keys but I am unable to get them enabled on text fields. I'm not having any errors though if I post something on the internet then I'll probably have a breakthrough after I hit the submit button. Some of this code might look familiar to some folks around here. ;)
- John
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test page</title>
<script type="text/javascript">
function pkeys() {
var pkeysEnabled = true;if (!pkeysEnabled) {return;}
else {alert('uh hi!');}// end if pkeysEnabled
}window.onkeydown=function(e){
if (e.keyCode==8 ¦¦ e.keyCode==32) {
return false;
}
}function pkeysinit() {
// Find all input fields we're interested in
var inputs = document.getElementsByTagName("input");
var selects = document.getElementsByTagName("select");
var texts = document.getElementsByTagName("textarea");
var tags = new Array();// Push every element into tags
for (var i =0 ; inputs[ i]; i++) tags.push( inputs[ i]);
for (var s =0 ; selects[ s]; s++) tags.push( selects[ s]);
for (var t =0 ; texts[ t]; t++) tags.push( texts[ t]);// Search all our input fields....
for( var t = 0; t < tags.length; t++) {
var tag = tags[ t]; // Make code a little more legible// Check it's input text, or SELECT, or TEXTAREA
if( (tag.tagName == "input" && tag.type == "text") ¦¦ (tag.tagName == "input" && tag.type == "password") ¦¦ (tag.tagName == "select") ¦¦ ( tag.tagName == "textarea")) {
addEvent( tag, "focus", powerKeysDisable); // Disable when active
addEvent( tag, "blur", powerKeysEnable); // Enable when not active
}
}addEvent(document, "keydown", keyPressed);
}function addEvent(elm, evType, fn, useCapture)
{
//Credit: Function written by Scott Andrews
//(slightly modified)
var ret = 0;if (elm.addEventListener)
ret = elm.addEventListener(evType, fn, useCapture);
else if (elm.attachEvent)
ret = elm.attachEvent('on' + evType, fn);
else
elm['on' + evType] = fn;return ret;
}function start() {
pkeysinit();
}
window.onload = start;</script>
</head><body>
<div style="background-color: #bbb; height: 4000px; width: 100%;">
<p>We want the spacebar to <b>not</b> act as pagedown but enable it to work in input[text/password] and select elements.
The same thing applies with the backspace key though we want to prevent it from acting as a back button.</p>
<form>
<fieldset>
<div><input size="22" type="text" value="123"></div>
<div><input size="22" type="text" value="backspace this"></div>
<div><input size="22" type="text" value="space_the_underscores"></div>
<div><input size="22" type="text" value=""></div>
</fieldset>
</form>
</div></body>
</html>
- John
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test page</title>
<script type="text/javascript">function keyPressed(evt) {
var pkeysEnabled = true;
if (!pkeysEnabled) {
return;
}
else if(document._powerKeysEnabled == true) {
// the focus is NOT on a form element
if (evt.keyCode==8 ¦¦ evt.keyCode==32) {
// don't allow backspaces or spacebars
evt.preventDefault();
return false;
}
}}//pkeys()
function pkeysinit() {
// Find all input fields we're interested in
var inputs = document.getElementsByTagName("input");
var selects = document.getElementsByTagName("select");
var texts = document.getElementsByTagName("textarea");
var tags = new Array();// Push every element into tags
for (var i =0 ; inputs[ i]; i++) tags.push( inputs[i]);
for (var s =0 ; selects[ s]; s++) tags.push( selects[ s]);
for (var t =0 ; texts[ t]; t++) tags.push( texts[ t]);// Search all our input fields....
for( var t = 0; t < tags.length; t++) {
var tag = tags[ t]; // Make code a little more legible
var nodeName = tag.nodeName.toLowerCase();
var type = tag.type.toLowerCase();
// Check it's input text, or SELECT, or TEXTAREA
if( (nodeName == "input" && type == "text") ¦¦ (nodeName == "input" && type == "password") ¦¦ (nodeName == "select") ¦¦ ( nodeName == "textarea")) {
addEvent( tag, "focus", powerKeysDisable); // Disable when active
addEvent( tag, "blur", powerKeysEnable); // Enable when not active
}
}addEvent(document, "keydown", keyPressed);
// start off ._powerKeysEnabled at true
document._powerKeysEnabled = true;
}function powerKeysDisable(e) {
// a form element has the focus
document._powerKeysEnabled = false;
}function powerKeysEnable(e) {
// a form element lost the focus, so we're no where right now
document._powerKeysEnabled = true;
}function addEvent(elm, evType, fn, useCapture)
{
//Credit: Function written by Scott Andrews
//(slightly modified)
var ret = 0;if (elm.addEventListener)
ret = elm.addEventListener(evType, fn, useCapture);
else if (elm.attachEvent)
ret = elm.attachEvent('on' + evType, fn);
else
elm['on' + evType] = fn;return ret;
}function start() {
pkeysinit();
}
window.onload = start;</script>
</head><body>
<div style="background-color: #bbb; height: 4000px; width: 100%;">
<p>We want the spacebar to <b>not</b> act as pagedown but enable it to work in input[text/password] and select elements.
The same thing applies with the backspace key though we want to prevent it from acting as a back button.</p>
<form>
<fieldset>
<a href="index3.html?file">self anchor</a>
<div><input size="22" type="text" value="123"></div>
<div><input size="22" type="text" value="backspace this"></div>
<div><input size="22" type="text" value="space_the_underscores"></div>
<div><input size="22" type="text" value=""></div>
</fieldset>
</form>
</div></body>
</html>
