We help IT Professionals succeed at work.

We've partnered with Certified Experts, Carl Webster and Richard Faulkner, to bring you a podcast all about Citrix Workspace, moving to the cloud, and analytics & intelligence. Episode 2 coming soon!Listen Now

x

How can I disable the Tab and Enter Key?

indyng
indyng asked
on
Medium Priority
1,851 Views
Last Modified: 2008-01-16
Hi Experts,

How can I disable the Tab and Enter Key?

Thanks
Comment
Watch Question

Commented:
add a key 'listener'

function myKeyListener(event) {
       if (!event) {
            event = window.event;
      }
      //alert (event.keyCode);

      if (event.keyCode == 13) {
            // enter key - do nothing
      }
       // add one for the tab key
}

then add this function to the onkeydown event for the page/textbox/etc
http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_21382788.html tries something similar

Author

Commented:
Is it possible to disable these keys onload of the "default.asp" page rather than onkeydown?

Thanks

Commented:
on the onload event, you would have to add the function so that onkeydown of whatever item you want the keys disabled

Author

Commented:
So this function is only fired when the user types?

Commented:
yes

Author

Commented:
I want to fire the function on load of the "default.asp" page.

Can you provide more specific code for this? I am sorry but I am not very good at Java script.

Thanks

Commented:

Steps are:

1. <body onload="init()">

2. define init()

function init() {
   document.onkeypress = myKeyListener;
   if (document.layers) document.captureEvents(Event.KEYPRESS);
}
function myKeyListener(event) {
       if (!event) {
          event = window.event;
     }
     //alert (event.keyCode);

     if (event.keyCode == 13) {
          // enter key - do nothing
     }
       // add one for the tab key
}


or a shorter example
http://www.felgall.com/jstip43.htm
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
@kawas: A bit nonchalant to not kill the event, to leave the tab key as an exercise for the reader and to not handle other browsers than IE
Pravin AsarPrincipal Systems Engineer
CERTIFIED EXPERT
Top Expert 2005

Commented:
Following diables tab and enter key for all fields on page
<script language="javascript">
function keyHandler(e) {
var pK = e ? e.which : window.event.keyCode;
if (pk == 13) { return false; }
if (pk == 9) { return false; }
}

function DisableEnterAndTab () {
      if (document.all) // IE
     {
     document.onkeypress = kH;
     }
      if (document.layers)  {
        document.captureEvents(Event.KEYPRESS);
     }
}
</script>

<body onload="DisableEnterAndTab();">
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:

Commented:
that disables on a textfield, not the whole page
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
@pravinsar :Please test your code. Especially when the asker tells you he is not great at JS - document.all is IE and document.layers is NS4 - what about mozilla and FF?

<script language="javascript">
function kH(e) {
var pK = e ? e.which : window.event.keyCode;
if (pk == 13) { alert('No enter'); return false; }
if (pk == 9) { alert('No tab'); return false; }
}

function DisableEnterAndTab () {
      if (document.all) // IE
     {
     document.onkeypress = kH;
     }
      if (document.layers)  {
        document.captureEvents(Event.KEYPRESS);
     }
}
</script>

<body onload="DisableEnterAndTab();">
<form onSubmit="alert('No you did not disable them'); return false">
<input type="text" name="t1" value="">
<input type="text" name="t2" value="">
<input type="submit">

</form>

Author

Commented:
This is what I have:

function init()
{
 document.onkeypress = myKeyListener;
 if (document.layers) document.captureEvents(Event.KEYPRESS);
}

function myKeyListener(event)
{
 if (!event)
 {
  event = window.event;
 }
 if (event.keyCode == 13)
 {

 }
}

I checked out http://www.felgall.com/jstip43.htm

I do not know how to incorporate this. Please be more specific and just provide me with the script.

Thanks
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
@experts: I do not have time to find the combo I wanted to find.

Please look here and test before presenting
http://www.webmasterworld.com/forum91/5129.htm

Here is a cool site though. the prototype.js has a lot of cross browser event handling

http://prototype.conio.net/

Author

Commented:
This is what I have now and it works but only for Enter key:

<SCRIPT Language="JavaScript">
function kH(e)
{
 var pK = e ? e.which : window.event.keyCode;
 return pK != 13;
}

function DisableEnterAndTab ()
{
 if (document.all) // IE
  {
  document.onkeypress = kH;
  }
 if (document.layers)  
  {
  document.captureEvents(Event.KEYPRESS);
  }
}
</SCRIPT>

How do I incorporate the Tab key?

Thanks
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
return pK != 13 && pK != 9;
Principal Systems Engineer
CERTIFIED EXPERT
Top Expert 2005
Commented:
Here is updated code, does detailed browser check and disable  tab key.

Tested with IE 6.XX, FF 1.5X, NS8+

<html>
<head>
<title>Disable Enter and Text </title>

<script language="javascript">
function BrowserType () {
      var srchText = navigator.userAgent;
      var brwTypes = ("Opera,MSIE,Netscape,Firefox").split(',');
      for (var ix=0; ix < brwTypes.length; ix++) {
            if (srchText.toString().match(brwTypes[ix])) {
                  return brwTypes[ix];
            }
      }
      return null;
}
var brwType = BrowserType();
function doAction (evt) {
      return false;
      if (evt) {
            evt.returnValue = false;
            evt.cancelBubble = true;
      }
      else {
            alert ('Bad Event Object');
      }
}

function kH(e) {
      evt = (e) ? e : window.event;
      var type = evt.type;
      var pK = e ? e.which : window.event.keyCode;
      if (pK == 9) { pK = 13; evt.keyCode = 13; }
      if (pK == 13) {
             doAction (evt);
             return false;
      }
      if (pK == 9 || pK == 0) {
            doAction (evt);
            return  false;
      }
}

function DisableEnterAndTab ()
{
      if (!brwType) { return; }
      if (brwType == 'MSIE') {
            document.onkeypress = kH;
            document.onkeydown = kH;
      }
      else if (brwType == 'Firefox') {
            document.onkeypress = kH;
      }
      else if (brwType == 'Netscape') {
            document.onkeypress = kH;
            if (document.captureEvents) {
            document.captureEvents (Event.KEYPRESS);
            }
      }
      else {
            alert ('UnSupported Browswer');
      }
}
DisableEnterAndTab();
</script>
</head>

<body>
<form name="MyForm" onSubmit="alert('No you did not disable them'); return;">
<br>
<input type="text" name="t1" value="">
<br>
<input type="text" name="t2" value="">
<br>
<input name="TheText">
<br>
<input type="submit">
</form>

</body>
</html>

Not the solution you were looking for? Getting a personalized solution is easy.

Ask the Experts
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
Hehe.. Just needed a little nudge

Michel
Pravin AsarPrincipal Systems Engineer
CERTIFIED EXPERT
Top Expert 2005

Commented:
Michel

Thanks for movitating me to get a better solution.

My earlier solution does not work in all browser.

Please try it yourself

Author

Commented:
return pK != 13 && pK != 9;

This is not working. Thanks
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
Pravinsar: I think this only works in IE: evt.keyCode = 13;

Author

Commented:
mplungjan: What you gave me - "return pK != 13 && pK != 9;" only works for Enter key and not Tab.

Thanks
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
Possible. Try Pravinsar's script.
Pravin AsarPrincipal Systems Engineer
CERTIFIED EXPERT
Top Expert 2005

Commented:
Trying to catch tab event is a tricky thing. First I thought the code posted earlier would work. Hence a new version.

Access more of Experts Exchange with a free account
Thanks for using Experts Exchange.

Create a free account to continue.

Limited access with a free account allows you to:

  • View three pieces of content (articles, solutions, posts, and videos)
  • Ask the experts questions (counted toward content limit)
  • Customize your dashboard and profile

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.