Jquery 複数イベント設定し、一方だけが引数を設定する場合

Question

下記の#2のように、実質同じようなイベントハンドラー（submitしたいだけ）について、keypressがイベント引数を設定してkeyCodeを拾わなければならないという理由でそれぞれ分けて記載することで冗長なコードになってしまいます。もちろん#1のように記載することはできないのですが、このように片方は引数を足らなくてはならないようなイベントの場合は、まとめて記載することはできないのでしょうか？

#1
$('#hoge').on('click keypress',function(event){
   if(event.keyCode==13){
   　$('#piyo').submit();//#hogeがfocus状態で、enterkeyが押されたらsubmit
   }
   $('#piyo').submit();//#hogeをclickしたら#piyoをsubmit
})

#2
$('#hoge').on('click',function(){
   $('#piyo').submit();//#hogeをclickしたらsubmit
})

$('#hoge').on('keypress',function(event){
   if(event.keyCode==13){
   　$('#piyo').submit();//#hogeがfocus状態で、enterkeyが押されたらsubmit
   }
})

Answer 1

hogeをクリックしたらsubmitされるなら、hogeがフォーカスされて
エンターをうけることもないし、そもそもinputでエンターを入れれば
サブミットされるのはformの仕様なのでやっている事自体は無意味だと
思いますが・・・あくまで複数イベントの指定の仕方

(1)onの中で{"イベント名"：コールバック,・・・・}で指定すれば
複数イベントを並行してかけます

$(function(){
  $('#hoge').on({
    'click':function(){
      $('#piyo').submit();
    },
    'keypress':function(e){
      if(e.keyCode==13){
        $('#piyo').submit();
      }
    },
  });
});

(2)イベントのタイプを拾う

$(function(){
  $('#hoge').on('click keypress',function(e){
    if((e.type=="keypress" && e.keyCode==13)||e.type=="click"){
        $('#piyo').submit();
    }
  });
});

※(2)修正

Comments

[maguzo]

yambejp様
ご回答いただきありがとうございます。
#hogeがinputやbuttonタグではなくdivタグであったため、tabindexを設定した上で、クリック以外にボタンと同様に取り扱うためにenterでsubmitを受け付ける必要があるところから検討しておりました。
(1)の書き方は知らなかったのですが、コードの量は実質2倍ですね。。
(2)ではtypeプロパティというのがあるのですね、
非常に勉強になりました。

[yambejp]

仮に#hogeがdivだったとしても、clickしてsubmitされたらkeypress
されることはないとおもいますが・・・
まぁ思うところがあるのでしょう
(2)の記述一部修正しておきました

[maguzo]

すみません、もしかして私が思い違いをしていたらコードを描き直したいので
お尋ねしたいのですが、
<form action="foo.php" method="post" id="piyo">
　<input type="text" name="text" >
　<div id="hoge">button</div>
<form>
と言った場合に、inputからtabを押して、#hogeにフォーカスしたところで、enterをしてsubmitを実行したいこともあれば、マウス操作で直接#hogeをclickするというケースもあるという意味合いだったのですが、おかしなところがあれば忌憚のないご意見をいただければと思います。
重ねて失礼いたします。

[yambejp]

勘違いだったらすみません
inputからtabをおしてdivにフォーカスしますか？

[maguzo]

その通りです、したがって書き漏れましたが
<div id="hoge" tabindex="0">button</div>
でした。
たびたび申し訳ございません。