如何获得事件缩放的值并从输入更改它

How I can get the values of the event zoom and change it from an input

本文关键字：输入 何获得 事件 缩放      更新时间：2023-09-26

我的情况是这样的:

我使用这个库:

http://fengyuanchen.github.io/cropper/

我可以看到，我可以使用事件缩放来检索缩放图像的值。所以我想知道如何从一个像selectable这样的输入中获取并改变它

var $content = $(c_s),
    $image = $(p_s),
    $dataWidth = $(i_w_s),
    $dataHeight = $(i_h_s),
    $dataX = $(i_x_s),
    $dataY = $(i_y_s),
    options = {
        autoCropArea: 1,
        strict: true,
        guides: true,
        highlight: true,
        dragCrop: false,
        cropBoxMovable: false,
        cropBoxResizable: false,
        movable: true,
        background: true,
        minContainerWidth: 340,
        minContainerHeight: 226,
        minCanvasWidth: 340,
        minCanvasHeight:226,
        minCropBoxWidth: 340,
        minCropBoxHeight:226,
        aspectRatio: radio,
        crop: function (data) {
            $dataX.val(Math.round(data.x));
            $dataY.val(Math.round(data.y));
            $dataHeight.val(Math.round(data.height));
            $dataWidth.val(Math.round(data.width));
        }
    };
$image.on({
  'zoom.cropper': function (e) {
    console.log(e.type, e.ratio);
  }
}).cropper(options);

这是这个库的文档https://github.com/fengyuanchen/cropper zoomcropper

在代码的末尾，你可以看到我有一个console.log来检查是否有什么，但在我的Firebug控制台什么也没有

文档 

$().on('zoom.cropper', function (e) {
  var maxRatio = 10;
  var imageData = $(this).cropper('getImageData');
  var currentRatio = imageData.width / imageData.naturalWidth;
  // Zoom in
  if (e.ratio > 0 && currentRatio > maxRatio) {
    // Prevent zoom in
    e.preventDefault();
    // Fit the max zoom ratio
    $(this).cropper('setCanvasData', {
      width: imageData.naturalWidth * maxRatio
    });
  }
  // Zoom out
  // ...
});
代码

$image.on({
  'zoom.cropper': function (e) {
    console.log(e.type, e.ratio);
  }
}).cropper(options);

看区别…语法

应该是

$image.cropper(options);
$image.on('zoom.cropper', function (e) {
    console.log("Here "+e);
})
相关文章：