Question

I have a jquery function that binds a select field on a form to multiple actions. It binds to both change and keyup, so that mouse and keyboard clicks are both captured.

$(document).ready(function(){
  $('#user_id').bind('change keyup',function () {
    calculateAmounts();
  }).change();
});

This works perfectly.

However, in addition to running on the change and keyup functions, the calculateAmounts() function is also called when first loading the page. I’d like to prevent this code from running when the page is first loaded.

Answer 1

You’re triggering a change event when you call .change() on the $(‘#user_id’) element, which will call your change/keyup event handler. If you remove the .change() call, then that event won’t be triggered when the page loads:

$(document).ready(function(){
  $('#user_id').bind('change keyup',function () {
    calculateAmounts();
  });
});