Question

我正在使用cropperJS，我正在试图使用setCropBoxData的函数，但这不起作用，而且Documentation没有给出明确的（我认为）示例如何使用它。拜托，如果有人可以帮助我会很棒。

这是我的功能

function createCropper() {
data = new FormData();
var file = $('#file')[0].files[0];
$('#' + globalId).attr('src', window.URL.createObjectURL(file));
$('#img2').attr('src', window.URL.createObjectURL(file));
var image = document.getElementById('img2');
cropper = new Cropper(image, {
    aspectRatio: Cropwidth / Cropheigh,
    autoCropArea: 0.65,
    restore: false,
    center: false,
    highlight: false,
    cropBoxResizable: false,
    toggleDragModeOnDblclick: false,
    built: function () {
        cropper.setCropBoxData({ width: "100", height: "100" });
    }
});
cropper.crop();

}

我也尝试过：

function createCropper() {
data = new FormData();
var file = $('#file')[0].files[0];
$('#' + globalId).attr('src', window.URL.createObjectURL(file));
$('#img2').attr('src', window.URL.createObjectURL(file));
var image = document.getElementById('img2');
cropper = new Cropper(image, {
    aspectRatio: Cropwidth / Cropheigh,
    autoCropArea: 0.65,
    restore: false,
    center: false,
    highlight: false,
    cropBoxResizable: false,
    toggleDragModeOnDblclick: false,
    built: function () {
        cropper.cropper("setCropBoxData", { width: "100", height: "100" });
    }
});
cropper.crop();

}

提前致谢

Answer 1

我解决了..请在此处参阅我的解决方案。.setting cropbox data

setCropBoxData（）函数对我也不起作用，但是在学习和在几次试验中，我找到了一种使用data属性初始化宽度和高度的方法。

 data:{
   width: 240,
   height:  507,
 },

请参阅链接以查看我的方法。

稍后谢谢我。

Answer 2

我不确定这是否可以解决您的问题，但是我认为数据对象仅接受integer值。每当我尝试传递一个float值时，似乎都不会更改裁剪框。在示例中传递的string值也是如此。试试这个：

built: function () {

    cropper.cropper("setCropBoxData", { width: 100, height: 100 });

}

或者这取决于您使用的实现方式：

built: function () {

    cropper.setCropBoxData({

        width: 100,
        height: 100,

    }

}

cropperJS中的setCropBoxData不起作用

2 个答案: