将不同选择器的不同事件组合到一个功能中

时间:2013-03-03 03:37:02

标签: jquery events css-selectors

如何在一个相同的函数中组合$('#foo')。click()和$('#bar')。change()?

假设:

$('#foo').click() + $('#bar').change() (function{
  //...
});

这是我正在寻找的东西:

function foobar() {
  // ...
}
$('#foo').click(function{
  foobar();
});
$('#bar').change(function{
  foobar();
});

相关HTML:

<select id="bar">
  <option>dummy1</option>
  <option>dummy2</option>
</select>
<button id="foo">foo</button>

2 个答案:

答案 0 :(得分:5)

如果您不希望click上的#barchange上的#foo,这是唯一的方式:

$( '#foo, #bar' ).on( 'click change',  function ( event ) {
    if( ( event.type == 'click' && event.target.id == 'foo' )
        || ( event.type == 'change' && event.target.id == 'bar' ) ) {

        //process event here
    };
} );

虽然我认为您列出的想要的方法是更好的方法。哪个更容易阅读和理解?:

function foobar() {
    // ...
};

$( '#foo' ).click( foobar );
$( '#bar' ).change( foobar );

答案 1 :(得分:0)

$(":input").click(function(){
    alert($(this).attr('id'));
    foobar(); //you can pass here the id as parameter to your function
})

http://jsfiddle.net/5vgKm/