jQueryのEnterでカーソル移動って...


Enter/Tab項目移動とFunctionKey制御 jqKeyプラグイン更新 - せかにゃ~
内容が古くなりましたので、上記記事をさんしょうしてください。

前回べた書きしましたが、プラグイン化で整理しました。

[http://hidenet.ath.cx/jqEnterTab.js:title=jqEnterTab.js SourceCode]
$.extend($.fn,{
	EnterTab:function(o){

		var Focus_Move = function(df,i,ln,shift){
			//フォーカスを取得できないものは飛ばします
			var mv;
			if (shift){
				mv	= -1;
			}else{
				mv	= 1;
			}
			var j = (i+mv) % ln;
			var Fo,Fs;
			while(i=j){
				
				Fo	=	df[j];
				Fs	=	Fo.style;
				if	(Fo.type!="hidden" &&
					!Fo.disabled &&
					Fo.tabIndex!=-1 &&
					Fs.visibility!="hidden" &&
					Fs.display!="none"){
					//対象のオブジェクトを戻す
					return Fo;
				}
				j=(j+mv) % ln;
			}
			//Hitしない場合
			return df[i];
		}
		var d = document;
		var $input = $(":input",this)
		$input.keydown(function(e){
			var	k	=	e.keyCode;
			var	s	=	e.shiftKey;
			var	obj	=	e.target;
			var blKey	=	true;
			if (!o.Enter && k==13) return true;
			if (!o.Tab && k==9) return true;

			if (k == 13 ||k == 9){
			//Enter tabによるフォーカス移動
				switch(obj.tagName){
				case "TEXTAREA":
					if (k!=13) blKey = false;
					break;
				case "INPUT":	case "SELECT":
					//fileは巧く動かないので除外
					if (obj.type!="file")	blKey = false;
					break;
				default:
				}
				//keyイベントを処理するもののみ抽出
				if (!blKey){
					//フォームオブジェクトが何番目か探す
					var ln = $input.length-1;
					var i;
					for (i=0;i<ln;i++){
						if ($input[i]==obj) break;
					}
					//次のフォームオブジェクト探す
					obj = Focus_Move($input,i,ln,s);
				}
			}

			if (!blKey){
				//イベントを伝播しない
				if (obj.type!="file"){
					//IE規定の動作キャンセル
					if(d.all) window.event.keyCode = 0;
					obj.focus();
					if (obj.select && obj.type!="button") obj.select();
				}else{
					blKey = true;
				}
			}
			return blKey;
		});
	}
});
2010/2/26jqEnterTabちょっと修正 使い方
$(function(){
	$(document).EnterTab({Enter:true,Tab:true});
	
	//初期Focus設定
	document.forms[0][0].focus();
});
動作サンプルWinのIE8とFirefox3.5のみ確認 [Enetr][Tab]を押して動作確認してください。 Shiftを押しながらの操作にも対応しています。 ご自由に改造して使ってください