I have an input element

<select id="test"></select>

on change I want to call multiple functions

$('#test').change(function1, function2);

functions for now are just alerts for now

var function1 = function(){alert('a');};
var function2 = function(){alert('b');};

Only the second function is being called. I know this because of alerts and brake points. I know one way to correct this would be to call function1, and function2 from another function, but I would like to avoid that.

I have an input element

<select id="test"></select>

on change I want to call multiple functions

$('#test').change(function1, function2);

functions for now are just alerts for now

var function1 = function(){alert('a');};
var function2 = function(){alert('b');};

Only the second function is being called. I know this because of alerts and brake points. I know one way to correct this would be to call function1, and function2 from another function, but I would like to avoid that.

• javascript
• jquery
• unobtrusive-javascript

5 Answers 5

I prefer not to use anonymous functions so I would create a new function and place all work inside it.

$('#test').change(onSelectChange);

var onSelectChange = function() {
    function1();
    function2();
}

You can always chain them:

$('#test').change(function1).change(function2);

You can do this -

$('#test').change(function1);
$('#test').change(function2);

You can do it like this:

$('#test').change(function(){function1(); function2();});

Why not try something like:

$('#test').change(function(){
   function1();
   function2();
};