javascript - How to Go To Next HTML element using Java Script -
suppose have basic html page 5 text box , 1 button @ end.
now want go next html element , let's next textbox (same tab does), on press of key code 412 , on press of key code 417 , should able go previous element( same shift + tab ).
now can not use tab or can tab key absent on key board. help.
well code detect key press below:
document.onkeyup = keycheck; function keycheck() { var keyid = event.keycode; document.form1.keyname.value = event.keycode; switch(keyid) { case 412: document.form1.keyname.value = "rewind prseesd"; break; case 417: document.form1.keyname.value = "forward pressed"; break; .................... }
now want next , prev on key code 412 , 417
first, build array elements in desired order:
var _arrelements = [ "myinput1", "myinput2", "myinput3" ];
second, change code detect textbox key pressed, find id in array , focus proper textbox before or after it:
function keycheck(evt) { if (typeof evt == "undefined" || !evt) evt = window.event; //ie... var keyid = evt.which || evt.keycode; var flag = 0; switch(keyid) { case 34: flag = -1; //backward break; case 33: flag = 1; //forward break; } if (flag == 0) return; //key not relevant var sender = evt.target || evt.srcelement; if (!sender) return; //key did not come valid element var nindex = -1; (var = 0; < _arrelements.length; i++) { if (sender.id == _arrelements[i]) { nindex = i; break; } } if (nindex < 0) return; //key did not come valid textbox var newindex = nindex + flag; if (newindex >= _arrelements.length) newindex = 0; if (newindex < 0) newindex = _arrelements.length - 1; document.getelementbyid(_arrelements[newindex]).focus(); }
live test case complete code available here: http://jsfiddle.net/yahavbr/vah8r/
in example i'm using page up
/page down
, no idea keys produce codes gave.
edit: can put id of every focusable element want in array, doesn't have textbox.
Comments
Post a Comment