如何使用jQuery处理两个不相关的事件

Question

I'm wondering if I can fire off both of these events together :

$("input[type=checkbox]").click(function(){
   if($(this).is(":checked"))
   {
       //Value of checkbox
       alert(this.value);
   }
});

and

$("input[type= 'text']").keyup(function(){
   alert(this.value);
});

I looked into .bind, but that seems to only work for one selected elements (ie $(p).bind("mouseout mouseenter).doSomething()) .

The situation I am running into is that I have a function that needs to fire anytime either one of these things occur.

Answer 1

Try

$("input[type=checkbox],input[type='text']").on('click keyup', function(){
   // code
});

Answer 2

If you still need the additional if, you can use:

$("input[type=checkbox]").click(function(){
   if($(this).is(":checked"))
   {
       //Value of checkbox
       alert(this.value);
       somethingHappened();
   }
});

$("input[type= 'text']").keyup(function(){
   alert(this.value);
   somethingHappened();
});

function somethingHappened() {
   // Do stuff
}

Answer 3

Two ways you can achieve this as shown below:

1. using "on" method:

    $(document).on('keyup click',"input[type=checkbox],input[type='text']", function(){ // Do stuff here.. }) 

2. Call function after the event.

    $("input[type=checkbox]").click(doSomething); $("input[type= 'text']").keyup(doSomething); function doSomething() { } 

Answer 4

Perhaps all you need is a common function?

$("input[type=checkbox]").click(function(){
   if($(this).is(":checked")) {
       special(this.value);
   }
});

$("input[type= 'text']").keyup(function(){
   special(this.value);
});

function special(val) {
   alert(val);
}

Answer 5

If your intent really is to invoke a function when any checkboxes/text fields across the whole page changes, you probably want something like this:

$('body').on('change', ':checkbox,:text', function () {


});

Note that the :checkbox and :text selectors are much nicer than input[type=checkbox] etc.