我已使用fengyuanchen / cropper v0.9.2在自举模式下进行图像裁剪和旋转。 对于裁切和旋转都可以正常工作,但是问题是裁切后将第一个图像保存为模态,假设我已经打开了模态的图像,将其裁切并保存(从服务器)并关闭模态。 然后,如果我再次打开图像,但显示的是旧图像而不是裁剪的图像。 但是,如果我重新加载页面,则显示为裁剪页面。 以下是我使用的一些代码。

 $(document).on('click', '.original_image_show', function() { //click on the image 
var data_original = $(this).find('img').attr('data-original');/ //get the src to to crop
 // #originalImageShow is the modal div's id.
$("#originalImageShow").find(".bootstrap-modal-cropper img").attr('src', data_original); //set the src of bootstrap modal from clicked image's src.


var $image = $('.bootstrap-modal-cropper > img');
$('#originalImageShow').on('shown.bs.modal', function() {
      //-----cropping code here-----
        }).on('hidden.bs.modal', function() {
    $image.cropper('destroy');//I have used this code to destroy the modal.
 });

有什么帮助吗?

===============>>#1 票数:0

我有问题,这是用于图像缓存。 当我首先单击图像时,然后浏览器缓存了该图像,然后它显示了来自缓存的旧图像,而不是裁剪的图像。

var data_original = $(this).find('img').attr('data-original');/ //get the src to to crop
var data_original = data_original+ '?'+Math.random()*Math.random();
 // #originalImageShow is the modal div's id.
$("#originalImageShow").find(".bootstrap-modal-cropper img").attr('src', data_original); //set the src of bootstrap modal from clicked image's src.

通过在图像的src中添加“'?'+ Math.random()* Math.random()”,解决了缓存问题。

  ask by murad translate from so

未解决问题?本站智能推荐: