javascript - Tab cursor when character inputed -



javascript - Tab cursor when character inputed -

here js fiddle example:

http://jsfiddle.net/t3u8q5vr/1/

html:

<input type="text" maxlength="1" size="1" /> <input type="text" maxlength="1" size="1" /> <input type="text" maxlength="1" value="e" tabindex="-1" size="1" readonly /> <input type="text" maxlength="1" size="1" /> <input type="text" maxlength="1" value="r" tabindex="-1" size="1" readonly /> <input type="text" maxlength="1" size="1" /> <div> <button class="buttons">á</button> <button class="buttons">é</button> <button class="buttons">í</button> <button class="buttons">ó</button> <button class="buttons">ú</button> <button class="buttons">ñ</button> <button class="buttons">ü</button> </div>

js:

$("input").bind("input", function () { var $this = $(this); if ($this.val().length >= parseint($this.attr("maxlength"), 10)) { var nextempty = $this.nextall("input[value=''], input:not([value])")[0]; if (nextempty) { nextempty.focus(); } } }); $('input').focus(function(){ $(this).addclass('active').siblings('.active').removeclass('active') }); $(".buttons").click(function () { var cntrl = $(this).html(); $('input.active').val(cntrl); var $curinputnode = $('input.active'); while($curinputnode.is('input:text') && $curinputnode.val() != ''){ $curinputnode = $curinputnode.next(); } $curinputnode.focus(); });

the above jsfiddle i've been working on has desired behavior want apply website (it auto tabs when character inserted via keyboard or via clicking 1 of buttons insert text).

when apply code website though, single button click (for illustration á) inserts 2 of á characters:

any thoughts on why occuring?

javascript jquery html

Comments

Popular posts from this blog

xslt - DocBook 5 to PDF transform failing with error: "fo:flow" is missing child elements. Required content model: marker* -

mediawiki - How do I insert tables inside infoboxes on Wikia pages? -

Local Service User Logged into Windows -