Binding multiple handlers to elements

Question

Hey, I'm new to JavaScript so this is most probably going to sound really basic but here goes.

My web page is made up of "modules" which I load into the page with jQuery, so that my JavaScript works with the new content that has been loaded into the page, I have been told to use callback functions.

My problem is though, how do I activate multiple callback functions?

here is some of my code:

function loadLoginForm() {
$('[name=loadLoginForm]').click(function() {
$("#mainWrap").css({ width:"300px", height:"200px" });
$("#mainWrap").load("modules/web/loginForm.php", null, loadRegisterForm);
});
}

This bit of code activates the function named "loadRegisterForm" but what do i do if I want to activate more than one?

I've tried a few ways of how I think it would be done but to no avail, also I tried Google but I believe I'm using the wrong terminology.

Answer 1

It may be something like what you need?:

function loadLoginForm() {
$('[name=loadLoginForm]').click(function() {
$("#mainWrap").css({ width:"300px", height:"200px" });
$("#mainWrap").load("modules/web/loginForm.php", null, function(data) {
  loadRegisterForm_1(data);
  loadRegisterForm_2(data);
  loadRegisterForm_3(data);
});
});
}

EDIT II:

function loadLoginForm() {
$('[name=loadLoginForm]').click(function() {
$("#mainWrap").css({ width:"300px", height:"200px" });
$("#mainWrap").load("modules/web/loginForm.php", null, function(data) {
  loadRegisterForm_1.call(this, data);
  loadRegisterForm_2.call(this, data);
  loadRegisterForm_3.call(this, data);
});
});
}