title: Can jQuery click events be unbound or reset?
body: <p>I've discovered a resource leak on a webpage I'm working on.</p>
  
  <p>This webpage has two textfields, that upon click show a modal dialog, perform a data request to the backend, and then present that information in a table that the user can select an entry from for use in the textbox they originally clicked.</p>
  
  <p>I'm binding the click events to the textboxes like so:</p>
  
  <pre><code>var $field = $('#one-of-the-text-fields');
  
  $field.click(function () {
          App.DialogClass.show();
          App.DialogClass.PopulateTable();
          App.DialogClass.GotoPageButtonAction(actionArgs);  // Offender!
  });
  </code></pre>
  
  <p>...Which calls...</p>
  
  <pre><code>App.DialogClass = (function($) {
  
  var pub {},
      $gotoPage = $('#pageNumberNavigationField'),
      $gotoPageButton = $('#pageNumberNavigationButton');
  
  // ...SNIP unimportant other details...
  
  pub.GotoPageButtonAction = function (args) {
      $gotoPageButton.click(function () {
          var pageNumber = $gotoPage.val();
          pub.PopulateTable(args);   // Breakpoint inserted here...
      });
  };
  
  return pub;
  
  })(jQuery);
  </code></pre>
  
  <p>I noticed the leak because when I ran through using Chrome's JavaScript debugger, I'm always having one extra breakpoint hit every time I click a different button (e.g. the first time I click field A, the breakpoint is hit twice.  When I hit field B after that, the break point is hit three times.  If I click A after <em>that</em>, the breakpoint is hit four times.  Extrapolate as necessary.)</p>
  
  <p>Nowhere in my code am I doing anything about an existing click event for a given field.  I suspect my leak stems from the fact that the events are not getting cleaned up.  That being said, I am also not terribly familiar with JavaScript/jQuery.  What are some techniques for removing click events from a control?</p>