2

将 Jcrop 添加到 Javascript 中的函数时,jcrop_api 变量变为未定义。当我使用在窗口加载时创建 Jcrop 时,我让插件工作(包括 api)$(document).ready(function() { ... });
问题是我希望用户能够保持纵横比,或者不仅仅是通过选中或取消选中复选框。所以我有以下内容:

$(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;
    });
}

我已经看到了其他答案,例如以下列方式调用 Jcrop:

$.Jcrop($('#cropbox_full'));

由于某种原因,这样做时 jcrop 框根本不会出现。很奇怪。所以基本上,我的问题是,我做错了什么,我该如何解决这个问题(以类似于上面的方式),以便我可以通过单击复选框来更改 aspectRatio?

4

2 回答 2

1

好的,这很简单……变量 ( jcrop_api) 只是在函数中设置,因此无法从函数外部访问。我通过将其设置为全局变量来解决此问题。我不知道这是否是不好的做法,但如果有人有更好的解决方案,我会很高兴听到它。

于 2012-12-14T15:22:13.000 回答
0

jcrop_api需要先定义 这里是 sum stuffs 来学习如何定义jcrop_api变量

var jcrop_api;
var cWidth = 100;
var cHeight = 100;

jQuery(function($){

  // initialize jcrop
  jcrop_api = $.Jcrop('#target');

  // set the selection area
  jcrop_api.animateTo([0,0,cWidth,cHeight]);

});

在正文部分图像标签中

<img src="demo_files/sago.jpg" id="target" alt="[Jcrop Example]" />
于 2016-07-19T11:48:08.857 回答