JQueryでイベントの代わりにカスタム関数をdivにバインドすることはできますか？

Question

これが可能かどうか、私はAS3でこれを行うことができたのだろうかと思います。マウスイベントだけをリッスンするdivのリスナーをバインドすることは可能ですか？

$("#mouse").bind("click", function(e) 
    { 
    alert(e.currentTarget.id); 
    } 

をしかし、あなたが見ることができるように、マウスイベントは、すでに「クリック」として宣言されていますので、一般的に、これはマウスイベントが結合される方法で、私は「ライオン」と呼ばれるdiv要素を持って言うことができます。私がしたいことは、関数を記述し、その関数を "ライオン"のdivにバインドすることです。そして、ライオンがそのようなマウスイベントに遭遇すると、関数はマウスイベントタイプを捕捉することができます。ここでは関数は次のとおりです。

$.fn.chkType = function(e) 
    { 
    var evt = e.type; 
    var str = ""; 

    switch(evt) 
    { 
     case "mouseover": 
     str = "MOUSE OVER"; 
     break; 

     case "mouseout": 
     str = "MOUSE OUT"; 
     break; 

     case "click": 
     str = "CLICK"; 
     break; 

     default: 
     break; 
    } 

    alert(str); 
    } 

そして、私は「ライオン」にこの機能を割り当てたい場合は、今、私はどのようにこれが可能になり、特定のではないのですか？私はたくさんの検索を行っていると私は来た最も近いのだった：私はあなたの入力をお願い申し上げます

http://api.jquery.com/bind/

。 ありがとうございます。

Answer 1

私はバインドするすべてのイベントにバインドすることをお勧めします。

$("#mouse").bind("click mouseover mouseout", function(e) { 
    //alert(e.currentTarget.id); 
    //alert(e.type); 
    console.log(this.id); 
    console.log(e.currentTarget.id); 
    console.log(e.type); 
}); 

更新
$.chkType方法の目的は何でしたか？なぜ型に直接警告しないのですか？

Answer 2

カスタムイベントを作成して要素にバインドすることができます。同じ機能を複数のイベントにバインドすることもできます。 （jQueryの1.7以上でP.S.、代わりbindのonを使用）

$("#mouse").on("lion click", function(e){ 
    alert(e.type); 
}); 

今#mouseは、それに取り付けられたlionイベントを有しています。明らかに、ブラウザはこのイベントを引き起こすことはできませんが、できます。

$("#mouse").trigger('lion');​ 

これにより、カスタムイベントがトリガーされます。

DEMO：http://jsfiddle.net/bav4K/2/

注：$.fnはjQueryのオブジェクトに機能を接続するために使用されます。 （あなたは$('#mouse').chkType()と呼ぶつもりはない）あなたのケースでは、$.chkTypeを代わりに使用することをお勧めします。