jQueryでhoverとclickのfunctionを1つにまとめるには?
hoverとclick それぞれ2つの同じ処理のfunctionがあったとします。
これをコンパクトに1つにまとめる方法を紹介します。
click
$('#target').click(function() { alert('foo'); });
hover
$('#target').hover(function() { alert('foo'); });
こんな風に、マウスイベントはそれぞれ違うんだけれど、実行する処理は同じ場合、よりコンパクトにさせたいですよね。
やり方やいたってシンプル。
var hoverOrClick = function () { alert('test'); } $('#target').click(hoverOrClick).hover(hoverOrClick);
または、bindを使って合体も可能です。
$('#target').bind('click hover', function () { alert('test'); });
今回はhoverと、clickの場合のみでしたが、あらゆるイベントを合体してあげることも可能ですね。