フォームの要素をEnterキーで移動ができ、マウスオーバーで色が変わり、フォーカスで色も変えられるという、ちょっとだけ便利なやつ!(相変わらずタイトルが長い)

フォームの要素間の移動は、[Enter]キーで、1つ戻す場合は、[Shift]+[Enter]で行います。
checkbox,radio をチェックするときは、[Ctrl]+[Enter]で行います
textarea の移動は、[Ctrl]+[Enter]で行います
button,submit の実行は、[Ctrl]+[Enter]です。これで、マウスに持ち替えなくても利用できそう〜!?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title></title>

<style type="text/css">

table {
  border-collapse: separate;
  border: 1px #888 solid;
}

td {
  border-color: #fff #aaa #ccc #fff;
  background-color:#f8f8f8;
}

th {
  border-color: #fff #aaa #aaa #fff;
  background-color:#ddd;
  font-size: medium;
}

td, th {
  color : #766;
  padding : 3px 3px 2px;
  border-width : 1px; border-style: solid;
  text-align :left;
  font-weight :normal;
  white-space: nowrap;
}

.fmFocus {
  border: 1px #f88 inset;
  background-color:#fee;
}

.fmBlur {
  background-color:#eee;
  border: 1px #ccc inset;
}

.fmHover {
  border: 1px red inset;
  background-color:#ffe;
}

</style>

<form>
  <table cellspacing="0">
  <tr>
    <th>名前<em>(必須)</em>
    <td><input type="text" id="new_Name" size="30" maxlength="20">
  
  <tr>
    <th>ふりがな
    <td><input type="text" id="new_Furigana" size="30" maxlength="20" value="">
  
  <tr>
    <th>生年月日
    <td>
      <input type="text" name="BirthDay_date" size="6"> 年
      <input type="text" name="BirthDay_date" size="4"> 月
      <input type="text" name="BirthDay_date" size="4"> 日
    
  
  <tr>
    <th>性別
    <td>
      <input type="radio" value="m" name="sex" id="new_Sex0" checked><label for="new_Sex0">男</label> /
      <input type="radio" value="w" name="sex" id="new_Sex1"><label for="new_Sex1">女</label>

  <tr>
    <th>その他事項
    <td><textarea rows="15" cols="45" id="new_Note"></textarea>
  
  <tr>
    <th><em>登録確認</em>
    <td><input type="button" value="登録" id="bt_rg" style="color:red">

  </table>
</form>

<script type="text/javascript">
//@cc_on

//****** エンターキーでフォーカス移動 ******

(function ( Listener ) {
  document./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener( /*@end@*/ 'keypress', Listener, false );
  window./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener( /*@end@*/ 'unload', function ( ) {
    document./*@if( @_jscript ) detachEvent('on' + @else@*/ removeEventListener( /*@end@*/ 'keypress', Listener, false );
    window./*@if( @_jscript ) detachEvent('on' + @else@*/ removeEventListener( /*@end@*/ 'unload', arguments.callee, false );
  }, false );
})(
    //Listener
    (function ( getN, getP ) {
      return function ( evt ) {
        var e       = evt./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/;
        var keyCode = evt./*@if( @_jscript ) keyCode @else@*/ which /*@end@*/;
        var shift   = evt.shiftKey;
        var ctrl    = evt.ctrlKey;
        var flag = true, n;

        if( !/INPUT|TEXTAREA|SELECT/.test( e.nodeName ) ) return;

        if( 27 == keyCode ) return e.blur();
        if( 13 == keyCode ) {
          if( /radio/.test( e.type ) && ctrl ) e.checked = true;
          if( /checkbox/.test( e.type ) && ctrl ) e.checked = !e.checked;
          if( /submit|reset|button/.test( e.type ) && ctrl ) flag = false;
          if( 'TEXTAREA' === e.nodeName && !ctrl && !shift ) flag = false;
          if( flag ) {
            n = shift ? getP( e ): getN( e );
            if( n ) try { n.focus(); } catch( err ) { ;}
            return evt./*@if( @_jscript ) returnValue = false @else@*/ preventDefault() /*@end@*/;
          }
        }
      };
    })(
      function ( n ) {
        var e;
        do {
          if( !( e = n.firstChild ) )
            while( !( e = n.nextSibling ) )
              if( !( n = n.parentNode ) ) return null;
          n = e;
        } while ( 1 !== n.nodeType || !/INPUT|TEXTAREA|SELECT/.test( n.nodeName ) || 'hidden' === n.type );
        return n;
      },

      function ( n ) {
        var e, e2;
        do {
          if( e = n.previousSibling )
            while( e2 = e.lastChild ) e = e2;
          n = e || n.parentNode ;
        } while ( !n || 1 !== n.nodeType || !/INPUT|TEXTAREA|SELECT/.test( n.nodeName ) || 'hidden' === n.type );
        return n;
      }
    )
  );

//_______________________________



//****** トークンリスト ******
var TokenList = (function ( cut, has ) {
  return function ( type ) {
 
    return {
 
      'contains':
        function ( e, name ) {
          if( !has( e[ type ], name ) ) {
            var keys = cut( name );
            var cnt = 0, key;
            
            while( key = keys[ cnt++ ] )
              if( !has( e[ type ], key ) )
                return false;
          }
          return true;
        },


      'add':
        function ( e, name ) {
          var keys = cut( name );
          var buf = [ ], cnt = 0, key;
          
          while( key = keys[ cnt++ ] )
            has( e[ type ], key ) || buf.push( key );

          e[ type ] += ( e[ type ] ? '\u0020': '' ) + buf.join( '\u0020' );

          return e[ type ];
        },


      'remove':
        function ( e, name ) {
          var keys = cut( e[ type ] );
          var buf = [ ], cnt = 0, key;
          
          while( key = keys[ cnt++ ] )
            has( name, key ) || buf.push( key );

          return e[ type ] = buf.join( '\u0020' );
        },


      'toggle':
        function ( e, name ) {
          var keys = cut( name );
          var aBuf = [ ], dBuf = [ ];
          var key, cnt = 0;

          while( key = keys[ cnt++ ] )
            has( e[ type ], key ) ?
              dBuf.push( key ): aBuf.push( key );

          e[ type ] += ( e[ type ] ? '\u0020': '' ) + aBuf.join( '\u0020' );

          dBuf.length && this.remove( e, dBuf.join( '\u0020' ) );

          return e[ type ];
        },


      'length':
        function ( e ) {
          return cut( e[ type ] ).length;
        },


      'item':
        function ( e, num ) {
          var a = cut( e[ type ] ) || [ ];
          return 'undefined' === typeof num ? a: a[ num ];
        }
    };
  };
})(
    function ( s ) { return ( '' + s ).split( /\u0020+/ ); },
    function ( s, n ) { return -1 < ( '\u0020' + s +'\u0020' ).indexOf( '\u0020' + n + '\u0020' ); }
  );

ClassList = TokenList( 'className' );
//______________________________________



//****** 自動でフォーカスされたstyleを変える ******

var AutoFocus = (function ( createListener ) {
  return function ( target, css_on, css_out, css_hover ) {
    var listener = createListener( css_on, css_out, css_hover );
    var forms = [ ], cnt = 0, fm;
    var emts = [ ], cnt2 = 0, emt;
    
    if( 'FORM' == target.nodeName )
      forms.push( target );
    else
      forms = target.getElementsByTagName( 'form' );
    
    while( fm = forms[ cnt ++ ] ) {
      emts = fm.elements;
      while( emt = emts[ cnt2++ ] ) {
        if( 'TEXTAREA' == emt.nodeName
          || ( 'INPUT' == emt.nodeName && 'text' == emt.type ) )
            ClassList.add( emt, css_out );
      }
    }

    if( css_on )
      target./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener( /*@end@*/
        /*@if( @_jscript ) 'focusin' @else@*/ 'focus' /*@end@*/, listener, true );
    
    if( css_out ) 
      target./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener( /*@end@*/
        /*@if( @_jscript ) 'focusout' @else@*/ 'blur' /*@end@*/, listener, true );

    if( css_hover )
      target./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener( /*@end@*/
        'mouseover', listener, true );

  };
})(
    function ( css_on, css_out, css_hover ) {
      var memory;
      return function ( evt ) {
        var e  = evt./*@if (@_jscript) srcElement @else@*/ target /*@end@*/;

        if( memory ) {
          ClassList.remove( memory, css_hover );
          memory = null;
        }

        if( /INPUT|TEXTAREA/.test( e.nodeName ) && ! /checkbox|radio|button/.test( e.type ) ) {
          if( 'mouseover' === evt.type ) {
            ClassList.add( e, css_hover );
            memory = e;
          } else
            ClassList.toggle( e, css_on + ' ' + css_out );
        }
      };
    }
  );


//______________________________________

AutoFocus( document, 'fmFocus', 'fmBlur', 'fmHover' );


</script>