フォームのテキストエリアとかに、ボタンでCTRL+Zを実現する?

最近、Fujillin さんとか、think49 さんとか、 yyr446 さんとか、
zeff さん とかが頑張るので、出遅れている。
キーが押されるたびに、バッファーに溜め込んでいます。文字数が多いとだめだな〜?
キーイベントも発火させられると、便利なのに。(危険だな)


追記。
アップしたとたんに締め切られた!最近多いんだよね。
「御礼はいらん!」と言ったけどさぁ〜。「ごくろうさん」とか
「おっ!FFでも動く」とかあるだろうよ!
まぁ〜ごみだけどさぁ・・・
ActiveXコントロールの初期化とスクリプトの実行
レベル下げさせたら危なくない?
まぁ〜何を言っても愚痴さぁ。

手直ししてアップし直しました。

<!DOCTYPE html>
<title></title>
<body>

<form id="frm1" action="#">
<div>
  <TEXTAREA name="t1" id="t1" cols="50" rows="10">文字を書いてね
  </TEXTAREA><br>
  <INPUT type="button" value="undo" name="b1" onclick="undo.textPop()">
</div>
</form>


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

var TextUndo = function ( n ) {
  this.n = n;   // 対象のノード
  this.t = [ ];  // テキストデータの保存バッファ
  this.t.push( n.value );
  this.max = 10; // バッファの保存数
  this.b = null; // 前回のテキストデータ、比較用
};


// テキストの保存
TextUndo.prototype.textPush = function ( ) {
  if( this.b == this.n.value ) return;
  this.t.push( this.b = this.n.value );
  if( this.max < this.t.length ) this.t.shift();
};


// テキストをバッファから取り出す
TextUndo.prototype.textPop = function ( ) {
  if( 0 < this.t.length ) this.n.value = this.t.pop();
};


// キーが押されたら、ノードのidからオブジェクトを探し出し、呼び出す
TextUndo.Listener = function ( e ) {
  var obj, n = e./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/;

  if( n.id && ( obj = this.memo[ n.id ] ) ) {
    if( 'keydown' === e.type ) obj.textPush();
  }
};


//作る
TextUndo.create = function ( nid ) {
  var n = document.getElementById( nid );

  return ( n && /^TEXT$|^TEXTAREA$/.test( n.nodeName ) ) ?
    this.memo[ nid ] = new TextUndo( n ): null;
};


// キーが押されたとき、そのidのオブジェクトが配列になっている
TextUndo.memo = [ ];


//イベントの貼り付けっぱなし
document./*@if( @_jscript ) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/
  'keydown', function ( e ) { TextUndo.Listener( e ); }, false );

//___________

var undo = TextUndo.create( 't1' );

</script>

クリックを直してたら、ぐだぐだになってしまった^^;

<!DOCTYPE html>
<title></title>
<body>

<form id="frm1" action="#">
<div>
  <TEXTAREA name="t1" id="t1" cols="50" rows="10">文字を書いてね</TEXTAREA><br>
  <INPUT type="button" value="undo" name="b1" id="b1">
</div>
</form>


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

var TextUndo = function ( n ) {
  this.n = n;   // 対象のノード
  this.t = [ ];  // テキストデータの保存バッファ
  this.t.push( n.value );
  this.max = 10; // バッファの保存数
  this.b = null; // 前回のテキストデータ、比較用
};


// テキストの保存
TextUndo.prototype.textPush = function ( ) {
  if( this.b == this.n.value ) return;
  this.t.push( this.b = this.n.value );
  if( this.max < this.t.length ) this.t.shift();
};


// テキストをバッファから取り出す
TextUndo.prototype.textPop = function ( ) {
  if( 0 < this.t.length ) this.n.value = this.t.pop();
};


// キーが押されたら、ノードのidからオブジェクトを探し出し、呼び出す
TextUndo.Listener = function ( e ) {
  var obj, n = e./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/;
  
  'keydown' === e.type && n.id && ( obj = this.memo[ n.id ] ) &&  obj.textPush();
  'click' === e.type && n.id && ( obj = this.memo2[ n.id ] ) && obj.textPop();
};


//作る
TextUndo.create = function ( nid, bid ) {
  var n = document.getElementById( nid );
  var b = document.getElementById( bid );
  var o = null;
  
  if( n && /^TEXT$|^TEXTAREA$/.test( n.nodeName ) ) {
    this.memo[ nid ] = o = new TextUndo( n );
    if( b )
      this.memo2[ bid ] = o;
  }

  return o;
};


// キーが押されたとき、そのidのオブジェクトが配列になっている
TextUndo.memo = [ ];
TextUndo.memo2 = [ ];

//イベントの貼り付けっぱなし
document./*@if( @_jscript ) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/
  'keydown', function ( e ) { TextUndo.Listener( e ); }, false );

//イベントの貼り付けっぱなし
document./*@if( @_jscript ) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/
  'click', function ( e ) { TextUndo.Listener( e ); }, false );

//___________

var undo = TextUndo.create( 't1', 'b1' );

</script>


</body>
</html>

ブリンクねた。

明日は、お休みなのでドライブに!

<!DOCTYPE html>
<title></title>
<body>

<h1>
 <span id="a0">点</span>
 <span id="a1">滅</span>
 <span id="a2">サ</span>
 <span id="a3">ン</span>
 <span id="a4">プ</span>
 <span id="a5">ル</span>
</h1>
<p>これは普通の文書</p>
<p id="b0">これは点滅する文章</p>


<script type="text/javascript">
//@cc_on
var Blinker = function ( viewTime, hiddenTime ) {
 this.timerId = null;
 this.buf = [ ];
 this.viewTime = viewTime;
 this.hiddenTime = hiddenTime;
 this.mode = false;
 this.start();
};

Blinker.prototype.view = function ( ) {
 for( i = 0, I = this.buf.length; i < I; i++ )
  this.buf[i].style.visibility = 'visible';
};

Blinker.prototype.hide = function ( ) {
 for( i = 0, I = this.buf.length; i < I; i++ )
  this.buf[i].style.visibility = 'hidden';
};

Blinker.prototype.start = function ( ) {
 this.timerId && this.stop();
 this.loop();
};

Blinker.prototype.loop = function ( ) {
 this.mode ? this.view(): this.hide();
 this.timerId = setTimeout( (function ( that ) {
  return function ( ) { that.loop(); }; })( this ),
  this.mode ? this.viewTime: this.hiddenTime );
 this.mode = ! this.mode;
};

Blinker.prototype.stop = function ( ) {
 this.timerId && clearInterval( this.timerId );
 this.timerId = null;
};

Blinker.prototype.add = function ( n ) {
 n && this.buf.push( n );
};

Blinker.create = function ( viewTime, hiddenTime ) {
 var obj = new Blinker ( viewTime, hiddenTime || viewTime );
 var arg = 2, id, n;

 while( id = arguments[ arg++ ] ) {
  n = document.getElementById( id );
  n && obj.add( n );
 }
 return obj;
};

//____________________

var str1 = Blinker.create( 200, 100, 'a0', 'a2', 'a4' );
var str2 = Blinker.create( 400, 200, 'a1', 'a3', 'a5' );
var str3 = Blinker.create( 1000, 500, 'b0' );


</script>