html - What javaScript code can I use so that the tab key skips one tabindex and the carrage return key skips X tabindexes? -
i amateur coder , javascript novice (or less), , trying build online form multiple (many) <textarea> inputs.
for arguments sake , let's presume 3 x 3 type orientation:
for reasons of other functionality & performance, must use <textarea> , not <inputs>.
if person presses [tab], expected tab-index adhered no worries ( a1 --> b1 ).
if person pressed [return], because <textarea>, adds \n delimiter, breaks line , remains within still focused <textarea>.
what happen when person presses [return], 3 tab-indexes 'skipped' (if right word), , focus goes <textarea> directly below previous focused <textarea>.
example: in a1; write/input something; press [return]; taken directly a2.
[[update]]
example of html text area code:
<textarea data-id="0" class="inputarea colorinput" id="datainput_0" name="colorinput_row_1" onfocus="classfocused();" onblur="classblured();" onkeyup="splitinput();"></textarea>
use jquery javascript framework, attach key press event listeners text areas , if key pressed [enter] (key code 13) shift focus field want (preferably set ids text areas identify them easily).
html
<textarea class="ta" data-id="1"></textarea> <textarea class="ta" data-id="2"></textarea> <textarea class="ta" data-id="3"></textarea> <textarea class="ta" data-id="4"></textarea> <textarea class="ta" data-id="5"></textarea> <textarea class="ta" data-id="6"></textarea> <textarea class="ta" data-id="7"></textarea> <textarea class="ta" data-id="8"></textarea> <textarea class="ta" data-id="9"></textarea> javascript
$(document).ready(function(){ //attach event listener on text areas $('.ta').keypress(function(e){ if (e.keycode == 13) //check if [enter] pressed { var currentid = $(this).attr('data-id'); //get id of text area happened if (currentid < 7) $('.ta[data-id="' + (currentid + 3) + '"]').focus(); //if there other text areas down line, shift focus } }); })
Comments
Post a Comment