Tab key inside div

  • Thread starter Thread starter rodchar
  • Start date Start date
is it possible to simulate the Tab key inside a Div element?
Click to expand...

Not sure what you mean...

The Tab key will set focus to the next editable element horizontally then
vertically - is this not what you want...?
 
no, i mean tab over spaces.

Mark Rae said:
Not sure what you mean...

The Tab key will set focus to the next editable element horizontally then
vertically - is this not what you want...?
Click to expand...
 
Not exactly an ASP.Net question but here is my response:

You can try placing a OnKeyPress or an OnKeyDown event on the div and have
them call a js function.

Your function should check the value of event.keyCode to see if tab was
pressed or not. I think the keycode for tab is 8 but I could be wrong. If it
is tab then append 4 or 8 spaces to the div's innerHTML/innerText etc then
make sure to return false and cancel event bubbling so the browser won't tab
to the next control.

Something like this

<div id="blah" onKeyPress="doTab;"></div>

<script language="jscript">
function doTab()
{
if event.keyCode == 8
{
document.all.item("blah").innerHTML += " ...";
event.returnValue = false;
event.cancelBubble = true;
};
}

</script>

Hope that works for you.
 
thanks for the help everyone.
rod.

Mohamad Elarabi said:
Not exactly an ASP.Net question but here is my response:

You can try placing a OnKeyPress or an OnKeyDown event on the div and have
them call a js function.

Your function should check the value of event.keyCode to see if tab was
pressed or not. I think the keycode for tab is 8 but I could be wrong. If it
is tab then append 4 or 8 spaces to the div's innerHTML/innerText etc then
make sure to return false and cancel event bubbling so the browser won't tab
to the next control.

Something like this

<div id="blah" onKeyPress="doTab;"></div>

<script language="jscript">
function doTab()
{
if event.keyCode == 8
{
document.all.item("blah").innerHTML += " ...";
event.returnValue = false;
event.cancelBubble = true;
};
}

</script>

Hope that works for you.
Click to expand...
 
Back
Top