title: jcrop_api is undefined?
body: <p>When adding Jcrop to a function in Javascript the jcrop_api variable becomes undefined. I had the plugin working (including the api) when I created the Jcrop on window load using <code>$(document).ready(function() { ... });</code>
  <br />
  The problem is I want the user to have the ability to maintain the aspect ratio or to not simply by checking or unchecking a checkbox. So I have the following:</p>
  
  <pre><code>$(document).ready(function() {
      $('#aspectratio').click(function() {
          alert(jcrop_api);
          if (!$(this).is(':checked')) {
              jcrop_api.setOptions({
                  aspectRatio: 0
              });
          } else {
              jcrop_api.setOptions({
                  aspectRatio: 31 / 12
              });
          }
      });
  }
  
  function stopUpload(success, newfile) {
      $('#target').attr('src', newfile);
      $('#preview').attr('src', newfile);
      $('#myfile').val('');
      $('#options').css('display', 'block');
      $('#target').Jcrop({
          onChange: updatePreview,
          onSelect: updatePreview,
          aspectRatio: 31 / 12
      }, function() {
          // Use the API to get the real image size
          var bounds = this.getBounds();
          boundx = bounds[0];
          boundy = bounds[1];
          // Store the API in the jcrop_api variable
          var jcrop_api = this;
      });
  }
  </code></pre>
  
  <p>I've seen other answers such as calling Jcrop in the following way:</p>
  
  <pre><code>$.Jcrop($('#cropbox_full'));
  </code></pre>
  
  <p>For some reason when doing this the jcrop box doesn't appear at all. Very odd. So basically, my question, what am I doing wrong, and how can I fix this (in a way similar to above) so I can change the aspectRatio from the click of a checkbox?</p>