By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,814 Members | 2,162 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,814 IT Pros & Developers. It's quick & easy.

Pressing Tab to Focus on <div>

P: n/a
Hi,

How do you make an element (e.g. <div>) to receive focus when pressing
TAB key? I understand that some elements such as <selectand <input>
by default will receive focus when the TAB key is pressed. Is there a
way to tweak a <divto get the same treatment?

Thank you.
Buhi
Jul 21 '08 #1
Share this Question
Share on Google+
3 Replies


P: n/a
SAM
mumebuhi a écrit :
Hi,

How do you make an element (e.g. <div>) to receive focus when pressing
TAB key? I understand that some elements such as <selectand <input>
by default will receive focus when the TAB key is pressed.
and more useful with the attribute 'tabindex'

Is there a way to tweak a <divto get the same treatment?
Not in html.
perhaps could you try with an anchor in this div ?
(that doesn't work on my Fx)

What do you expect to do ?
Tab to only one specific div ?
or to jump by tabbing from div to div ?

In all cases you'll have to catch the keycode of tab,
something like:

<body onkeydown="KeyCheck(event);" onkeyup="if(cod==9)jump();">

Your div(s) must all of then have an id.

<script type="text/javascript">
var cod=0, goal, D=[];
function KeyCheck(evt) {
evt = (evt) ? evt : ((event) ? event : null);
var evver = (evt.target) ? evt.target : ((evt.srcElement)
?evt.srcElement : null );
cod = evt.keyCode;
goal = evver
}
function init() {
var d = document.getElementsByTagName('DIV');
for(var i=0, n<d.length; i<n; i++) {
d[i].idx = i;
D[i] = d[i];
}
}
window.onload = init;
function jump() {
if(goal && (!goal.tagName || goal.tagName != 'DIV')
goal = goal.parentNode;
while(goal.tagName!='DIV') goal = goal.parentNode;
var i = (goal.idx>=D.length-1)? 0 : goal.idx+1;
location = '#'+D[i].id;
}
</script>

Not tested !

--
sm
Jul 21 '08 #2

P: n/a
Maybe a simpler question, when a <a id="a_id"is onFocus, can we
change the focus to e.g. <div id="div_id">?

Any JavaScript object responsible to keep track what currently is on
focus?

Jul 21 '08 #3

P: n/a
SAM
mumebuhi a écrit :
Maybe a simpler question, when a <a id="a_id"is onFocus, can we
change the focus to e.g. <div id="div_id">?

Any JavaScript object responsible to keep track what currently is on
focus?
the JS function focus() works only with elements of form

You can't give focus to a div, it's a nonsens.
(a div can't have an html action, so what to do with a focus ?)
but you can do :
location = "#"+'div_id'
to scroll to this div.
not tried but perhaps something like

<div id="div_id">
<a id="a_id" onfocus="var a=this.parentNode;
while(a.tagName!='DIV') a=a.parentNode; alert('div is: '+a.id);">
</div>

--
sm
Jul 21 '08 #4

This discussion thread is closed

Replies have been disabled for this discussion.