2

我试图在图像上绘制裁剪区域后立即在裁剪框左侧显示一个按钮（即在 mouseup 上）。

目前，我只能在用户绘制裁剪框区域然后单击图像上的其他位置后才能显示该按钮。

查看文档，cropend 事件可以使用各种“选项”，包括“mouseup”，我假设这是我在这里所追求的。

链接到cropend 事件文档

但是，我如何实际“使用”该选项？我不熟悉该语法可能是什么样的......

如果用户开始绘制新的裁剪框，我可能需要利用类似的东西来定位cropstart mousedown 选项，以便重新隐藏按钮，但我肯定能够从此处提供的建议中理解它。

这是我到目前为止所拥有的：

$(document).on('turbolinks:load', function() {
  let cropImage = document.getElementById('image-form-cropbox');
  // ... other variables
  let cropperInstance = new Cropper(cropImage, { 
    // ... various options
    crop: function(event) {
      $('#crop-x-field').val(event.detail.x);
      // ...
    },
    cropend: function(event) {
      $('#crop-submit-button')
        .position({
          my: 'right center',
          at: 'left center',
          of: $('.cropper-crop-box .line-w'),
        })
        .show();
    },
    // ...
  });
  // ...
});

预先感谢您的帮助！如果您需要任何进一步的信息，请告诉我！

更新 20180906T11:07:00 第一次绘制裁剪框时，在单击其他位置之前不会显示按钮。但是，如果我继续在同一图像上绘制另一个裁剪框，则按钮会在 mouseup 时立即显示。

更新 20180906T12:13:00 我能够通过重新排序函数来解决这个问题。在cropend 事件中，首先是.show()，然后是.position(...)

但是，如果有一些特定的方法可以针对我最初的问题中列出的 mouseup 选项，我暂时将这个问题保持开放和未回答。

4

0 回答 0