No.132

一回反応したら消滅するイベントを作りたい

　ゲームなど動きのあるものをJavascriptで作成しているとき、一回だけしか起動しないイベントを作りたいことがある。
　例えばガチャガチャのプレイボタンとか、面クリア時の処理とか、いろいろ思いつくものはあるだろう。

　そんなときに便利なのがjQueryのoneメソッド。
　イベントを自動で削除してくれる便利なメソッドだ。

$('要素').one('イベント', function(e) {
  処理
);

　クリックイベントだと下記のような雰囲気になる。

$('#gotonextstage').one('click', function(e) {
  alert('次のステージに進みます');
  location.href='/stage2/';
);

　oneメソッドは実質下記と等価と考えていい。

$('要素').on('イベント', function(e) {
  処理
  ...
  $(this).off(e);
);

　onメソッド同様、イベントは複数列記することができる。これも便利。

$('要素').one({
  'イベント1': function(e) {
    処理1
  },
  'イベント2': function(e) {
    処理2
  }
});