使用方向键切换INPUT焦点之左右键补遗
使用方向切INPUT焦之左右
年前曾在一小案作"利用方向切入焦"，留了一小尾巴: 若直接截左、右切焦，入文字失用左右移游的功能，有使用者的操作期，因此上只保留了上下切，左右移部分仍得依Tab及Shift-Tab。
最近又有理案的功能充需求，翻到同一支js。了明自己非徒，年技上是有一丁小，就手把左右切焦的功能也起~~
起好像很害，其我只是沾了jCaret好用jQuery Plugin的光，按下左右多查文字游，先游指向的是入位置(而非反白取了某段文字)，之後再由游所在位置定是否要切焦。游已在最前方按左 或 游已在最後方按右 才需焦左右移的。
程式例如下，供有趣的朋友考:
<!DOCTYPE html> <html><head> <title>Arrow Key Focus Moving</title></head><body><script type='text/javascript' src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.js'></script> <script type='text/javascript' src="http://jcaret.googlecode.com/files/jquery.caret.1.02.min.js"></script><script type="text/javascript"> $(function () { var baseIndex = 100; $("#tblGrid") .find("tr").each(function (r) { $(this).find("td").each(function (c) { $(this).find("input") .attr("tabindex", r * 100 + c + baseIndex) .addClass("cGridInput"); }); }); $("#tblGrid").on("keydown", ".cGridInput", function (evt) { var origTabIdx = parseInt($(this).attr("tabindex")); var tabIndex = origTabIdx; var $c = $(this).caret(); //利用jCaret Plugin取得入游 //目前未取文字段落，游指向的是文字插入位置 var noSel = $c.start == $c.end; switch (evt.which) { case 38: //上 tabIndex -= 100; break; case 40: //下 tabIndex += 100; break; case 37: //左(未取文字，且游在最前方才切) if (noSel && $c.start == 0) tabIndex--; break; case 39: //右(未取文字，且游在最後方才切) if (noSel && $c.start >= this.value.length) tabIndex++; break; default: return; } if (origTabIdx != tabIndex) { $(".cGridInput[tabindex=" + tabIndex + "]").focus(); return false; } return true; }); });</script><table id="tblGrid"><tr><td><input /></td><td><input /></td><td><input /></td><td><input /></td></tr><tr><td><input /></td><td><input /></td><td><input /></td><td><input /></td></tr><tr><td><input /></td><td><input /></td><td><input /></td><td><input /></td></tr></table></body></html> ?##来自http://blog.darkthread.net/post-2011-11-23-use-left-right-key-to-movie-focus.aspx黑暗执行绪
?