0

現在、YUI(アプリ フレームワーク)を使用してプロジェクトを作成しています。各要素に対していくつかのアクションがあります（別のページに移動する、クリアなど）。各ボタンに長押しアクションを追加したい。残念ながら、YUI はこの種のものをサポートしていません。jQueryで解決策を見つけました：

 var pressTimer

$("a").mouseup(function(){
  clearTimeout(pressTimer)
  // Clear timeout
  return false;
}).mousedown(function(){
  // Set timeout
  pressTimer = window.setTimeout(function() { ... your code ...},1000)
  return false; 
});

そして、ここに私の質問があります。この機能を現在のコードに追加するにはどうすればよいですか? 新しい関数を作成しても機能しないため、このコードを既存の関数に追加しても機能しません。

//編集済み 私のコードは次のようになります。

//stuff
events: {
'.button': {
click: 'select'
}
},

そして、選択機能があります：

select: function (e) {
//code
}
4

1 に答える 1

1

YUI には、Synthetic イベントという概念があります。$(foo).trigger('myFooEvent')これらのイベントは、jQueryと同様に動作するように定義した偽の DOM イベントです。合成イベントの定義は、 を呼び出すだけY.Event.define()です。あなたの場合、次のようになります。

Y.Event.define('longpress', {
  on: function (node, sub, notifier) {
    var timeout;

    sub._downHandle = node.on('mousedown', function (e) {
      timeout = setTimeout(function () {
        notifier.fire('longpress', {domEvent: e});
      }, 1000);
    });
    sub._upHandle = node.on('mouseup', function () {
      clearTimeout(timeout);
    });
  },
  detach: function (node, sub) {
    sub._downHandle.detach();
    sub._upHandle.detach();
  }
});

合成イベントを定義したら、それを使用するために必要なことは call だけnode.on('myevent')です。例: Y.one('#foo').on('longpress', fn).

YUI アプリ フレームワークはイベント委任を使用するため、合成イベントにイベント委任のサポートを追加する必要があります。イベント ユーザー ガイドの合成イベント セクションを読み、DOM サブスクリプションの矢印イベントの作成の例に従うことをお勧めします。

イベントを設定したら、他のイベントと同様にアプリ フレームワークで使用できるようになります。

events: {
  '.button': {
    'longpress': fn
  }
}
于 2013-06-14T15:05:14.467 に答える