動的に追加したViewに対してアニメーションを実行して、アニメーションが終了したらそのViewを完全に削除してしまいたい、というケースがあってハマったのでメモ。
基本的にはアニメーションの終了後に何かをするには、前もってAnimationListenerをセットしておけば良いはず。
AnimationListener の onAnimationEnd というメソッドをオーバーライドして処理を書く事になる。
この onAnimationEnd の中でアニメーション対象のViewを親のViewから削除しようとして、次の様に書いたら parentView.removeView の所で エラーで落ちた。
調べてみると、どうやら onAnimationEnd 内でUIの処理をするとまずいみたいだ。parentView.post() を呼んでUIスレッドに処理をRunnableの形で渡せば問題なく実行出来る様になった。
2013年2月15日
jQueryのイベントで return false はしない方が良い
前回の記事を書いている時に検索にヒットしたリンクでちょっと「へぇ~っ」となったものがあったのでメモ。
javascript - event.preventDefault() vs. return false - Stack Overflow
イベントのハンドラを書く時に、jQueryのイベントと通常のDOMのイベントでは
return false;
の意味が違うらしい。まずい、今まで気にしていなかった。。。
jQueryのイベント:
通常のDOMのイベント:
という事らしい。
jQueryのイベントハンドラで return false; をしてしまうと、イベントバブリングまで中止されてしまう。これはあまり好ましくない事だ。
なぜイベントバブリングを中止する事が好ましくない(or やってはいけない)のかは、下の記事を読めばよく分かる。
jQueryのイベントハンドラでは、
1. デフォルト動作を抑止するには、event.preventDefault() を 使う。
2. バブリングを中止する必要がある場合は、event.stopPropagation() もしくは
event.stopImmediatePropagation() を場面に応じて使い分ける。
3. return false は親要素にもイベントハンドラがアタッチされている場合などにバグの原因になり得るので、使う場合は十分に注意する。(もしくは使わない。)
というのが良いみたいだ。
javascript - event.preventDefault() vs. return false - Stack Overflow
イベントのハンドラを書く時に、jQueryのイベントと通常のDOMのイベントでは
return false;
の意味が違うらしい。まずい、今まで気にしていなかった。。。
jQueryのイベント:
- デフォルト動作を抑止。
- イベントバブリングを中止する。
通常のDOMのイベント:
- デフォルト動作を抑止。(但しブラウザのバージョンに依存)
- イベントバブリングの中止はしない。
という事らしい。
jQueryのイベントハンドラで return false; をしてしまうと、イベントバブリングまで中止されてしまう。これはあまり好ましくない事だ。
なぜイベントバブリングを中止する事が好ましくない(or やってはいけない)のかは、下の記事を読めばよく分かる。
jQuery Events: Stop (Mis)Using Return False | Fuel Your Coding
jQueryのバブリングと、「return false;」「e.stopPropagation();」「e.preventDefault();」について | ふじこのプログラミング奮闘記
JavaScriptのイベント伝播について覚書 | Linuxで自宅サーバ構築
結論
jQueryのイベントハンドラでは、
1. デフォルト動作を抑止するには、event.preventDefault() を 使う。
2. バブリングを中止する必要がある場合は、event.stopPropagation() もしくは
event.stopImmediatePropagation() を場面に応じて使い分ける。
3. return false は親要素にもイベントハンドラがアタッチされている場合などにバグの原因になり得るので、使う場合は十分に注意する。(もしくは使わない。)
というのが良いみたいだ。
[jQuery] Enterキーでフォーカスを移動するには
Enterキーでフォームを送信したくない時は
あるWebアプリケーションのフォームで、Enterキーを押してもSubmitされない様にする必要があって、ちょっと調べた。
リターン(Enterキー)でフォームを送信しない方法: 小粋空間
とりあえずこの記事の「4.押されたキーを判定して抑止する」の所に書いてある方法で対応出来た。
Enterキーで次のフィールドにフォーカスを移動するには
次に、どうせならEnterキーで次のフィールドにフォーカスを自動で移動させたいな~、という事になった。やってみたら、jQueryのおかげでこんな感じで割りと簡単に出来た。
Enterキーが押された時にfalseを返すのではなくて e.preventDefault() を使う様に変えた。その理由はこちらを参照。
Shift+Enterキーにも対応するには
さらについでにShift+Enterキーでの逆順の移動にも対応させてみた。
もっとキーイベントを細かく制御するには
こんな感じで作りだすと、欲が出てきてさらにファンクションキーや矢印キーにも対応したくなってくる。でも、自分で作らなくても何かあるんじゃないかな~という気もする。
探してみたら次の様なjQueryプラグインが見つかった。
Enter/Tab項目移動とFunctionKey制御をplugin化 - せかにゃ~
これで機能的には申し分無さそうだ。ただソースコードを見ると対象のフォームがdocument.forms[0]に固定されていたりするので場合によっては少し変更する必要があるかも知れない。
キーイベントを拾って独自の関数を実行するだけならこういうのもあった。(フォーカス移動の処理は自分で書く必要があるみたいだ。)
jQuery.gpKeyでキー操作が楽々に。 | Ginpen.com
最近はWindowsアプリケーションをWebに置き換える案件も多いので、きっとこの様なプラグインは役に立つと思う。
登録:
投稿 (Atom)